There are many ways you could achieve this, both dynamically using pricing/subscription objects or static.
I would suggest you start at https://gettingstarted.mendixcloud.com/link/home to familiarize yourself with the possibilities, and then see what solution fits your needs best :)
This can be accomblished by using a listview connected to an entity.
If you add a class such as .lv-col-xs-3 this will make your listview into 3 columns. Essentially the .lv-col classes are the same as the bootstrap grid system but applied to lists.
See the atlas UI framework for more information:
Your other option is keep the data static and use a layout grid with 3 columns. Then you can place containers inside them and style them to however you like. Maybe some of the building blocks in the Atlas UI framework can help.
If not it's very easy to create the css to make your containers look like your design.