A BEM based set of classes to style your pages in an authentic way.

It is just another boring, and opinionated, CSS styling library, by Rogério Taques.

It's not a framework, does not have a grid system, and it has a very limited number of components. But it is still very cool 😎 and helps you building visually attractive UIs for your website or web application with peace of mind.

But, it supports dark mode 🌙 by default. 🤩

✨ Demo ✨

You can either clone this repository and copy the boring.css and reset.css files to your project, or you can embed it to your HTML page using the CDN.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/rogeriotaques/boring-css/boring.css" />

It has a limited number of components, the most used ones.

• Badges
  • In 5 different colors
• Box (a multi-purpose container)
• Buttons
• Card
• Inputs (all standard types)
  • With labels
  • With helpers (small text below the input)
  • With addons (text or buttons before or after the input)
  • Grouped
• Notifications
  • In 4 different colors
• Code/Pre
• Progress bar
  • With defined progress (e.g. 50%)
  • With undefined progress (e.g. loading)
• Tooltips

If you need a grid system, you can use Simple Grid, as it is lightweight and very easy to use. By the way, you can find a slightly modified version of it, cleaned up to remove anything not related to the grid, in this repository as simple-grid.css.

Feel free to add your contribution to this project with a pull request.

Licensed under the MIT License.