design-blocks

Froala Design Blocks is a collection of over 170 pre-built HTML sections for building websites. Each block is a ready-to-use chunk of HTML and CSS for a common part of a web page: headers, footers, contact forms, pricing tables, feature highlights, testimonials, team member grids, call-to-action sections, and more. The idea is that you pick the blocks you want, copy their HTML into your project, and assemble a full page from them without writing layout code from scratch.

All blocks are built on top of Bootstrap 4, a widely used front-end framework. They also rely on Font Awesome for icons and Google Fonts (Roboto by default) for typography. The blocks are responsive, meaning they adjust their layout to fit both desktop and mobile screens.

You can access the blocks in several ways: download the repository directly, install it via npm, or use a visual builder at froala.com that lets you arrange and preview blocks in a browser without touching code. The project also has framework-specific versions for Angular, React, and Vue if you prefer to work within those ecosystems. Sketch and PSD design files are also available for designers who want to prototype in those tools.

The blocks are organized into categories and each category has its own HTML file in the dist folder so you can browse them as working examples. The CSS is available in both regular and minified form.

The license is the Froala Open Web Design License (FOWDL), which is specific to this project and different from standard open-source licenses. The project is free to use but the license terms should be reviewed before using it in commercial or redistributed work.