Frameworks for the frontend


Front-end frameworks are incredibly popular among many web developers. They make it immensely easier to create visually and functionally modern websites. Compatibility with the most important web browsers and the usually large selection of UI components are further advantages. But if you fire up the search engine, you'll find one the fastest: Bootstrap. But there are many others that can also be the better choice depending on the project.




1.)Bootstrap - the classic

With the right theme Bootstrap becomes really chic.

The frontend framework Bootstrap, developed by Twitter, is probably one of the best-known and most popular kits for the web frontend. The toolkit, which has been available under an open source license since 2011, contains extensive components for HTML, CSS and JavaScript as well as some exciting themes that can be used to significantly improve the design. Bootstrap, which is now in version 4, has focused on Responsive as well as Mobile-First design for all components.



Semantic UI

Semantic UI can be compared to Bootstrap in many ways. There is a wide selection of predefined components in HTML, CSS and JavaScript. However, an important part of the framework is the customizability. Thus, in addition to around 50 elements, there are also over 3,000 variables that can be used to customize the predefined components as easily as child's play. The individualization options go far beyond the simple changing of button colors. The framework even makes it easy to create completely custom themes.




Foundation is another framework with a large number of predefined elements. Besides the individual components, there are also completely assembled HTML templates, blocks or UI kits. On board are mobile-first and responsive design, in addition to the ability to customize elements with attributes. However, customization has its limits here. So if you value developing a completely custom theme with many customizable options, you should rather take a look at Semantic UI. For beginners with little programming experience or for a project start with fast progress, Foundation should be ideal.


If you like the Material Design developed by Google, you should take a closer look at the CSS framework Materialize. In addition to the usual components described in CSS, web developers can use some exciting JavaScript elements. These include images with parallax effects or the classic Material Design wave animation when a button is pressed.




Bulma is a free open source CSS framework based on Flexbox, currently used by more than 150,000 developers. It was released in 2016 and thus carries little legacy. With its very active community, it is a serious alternative to Bootstrap. Bulma doesn't require JavaScript, has an easy-to-learn syntax, and offers support for the latest version of Font Awesome. It comes with a simple and lean grid system as well as more than 100 small and helpful CSS tools.




The name says it all: Milligram is a very minimalistic CSS framework that is only two kilobytes in compressed size. It is limited to the most important components in a simple design. If you want to focus on speed and the essentials for your website, you should consider Milligram over the larger competition from Bootstrap and Co.



Kube UI

Not quite as small as Milligram, but still less than 300 kilobytes in size, is the next CSS framework. The Finnish company Imperavi has developed Kube UI, a minimalistic and quick to implement framework. Kube was developed in Sass and promises its users to quickly create their own website with only basic HTML, CSS and optionally JavaScript knowledge.