Hello Coders,
This article presents an open-source seed project generated by AppSeed on top of Fresh UI Kit, a popular Bulma CSS design crafted by CssNinja. Project comes with a simple Flask codebase to be used in any Python-based web aplication with ease. For newcomers, Bulma is a popular open-source CSS framework based on Flexbox. With more than 40k stars on Github and 300+ contributors, Bulma is a great alternative to Bootstrap being modular, developer-friendly, and easy to customize.
Thanks for reading! TL;DR;
- BulmaPlay - the product page (Free)
- BulmaPlay Demo - LIVE Deployment
- Dashkit Flask - the premium version (more pages and components)
What is Bulma
As defined in the official website, Bulma is a free, open source framework that provides ready-to-use frontend components that you can easily combine to build responsive web interfaces.
With more than 40k stars on Github and 300+ contributors, Bulma can be used to code complex UI interfaces by reusing the helpers and primitives provided in this modern CSS Framework - other features:
- Modern Framework - based on Flexbox specifications
- Mobile first, responsive
- Lightweight, modular and JS Free
- Built-in components: Cards, Tabs, Menus
To build fast a starter with Bulma takes less than a minute:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bulma CSS - Starter Page</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.1/css/bulma.min.css" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css" crossorigin="anonymous" />
</head>
<body>
<div class="container is-fluid">
<!-- Add here Bulma Stuff -->
</div>
</body>
</html>This minimal sample can be extended with ease to add more components and sections: buttons, cards.
BulmaPlay - Open-Source Starter
This Flask starter is coded on top of Fresh UI Kit, a popular one-page Bulma design crafted by CssNinja.
For those that find the HTML version useful, please access the below links:
- Fresh Landing page - the sources published on Github
- Bulma-Css - for more Bulma-based projects (free & commercial)
The UI is built on Bulma 0.9.1 and provides a few nice common sections used in landing pages:
Features Section
Pricing Section
More Cards to play with
Thanks for reading! For more resources, please access:
- Bulma-Css - a marketplace for modern Bulma-based products
- DashKit PRO - a premium Bulma-based product available in two flavors: Flask and Django.
