If you take a look at your CSS, you will see that approximately 90% of it, is layout related (like flexbox, grid, media queries etc) and the remaining 10% is about “true style”, like color, shadow, etc.

We belive that, doing your responsive layout with html only and then choosing your preferred method to do the rest, makes your working process way easier.

A lot of frameworks want to manage ALL the CSS and the result is an unreadable and unmanageable html.

To create a responsive layout with html only, we use 10 web components, which are designed to be responsive and let you build any kind of layout you can imagine.

Finally, to improve the html features, we add some utilities, which are attributes you can add to any html tag (not only nimbus components) to do some specific things.

Like define a padding, the ratio of an element, hide/show an element according to different parameters…

The “utility-first” era of CSS was the worst period we can imagine for web devs.

It imports your style from css files to your html, so yes, you don't have css files anymore, but your html becomes an unreadable mess.

We decided to solve this issue by taking a different approach: solve only the layout part of CSS in the html and let you choose how you want to style the rest.

The biggest benefit of our approach, is that you can manage your layout really easily and without pain.

One well known point of coding is the SRP, the single responsibility principle. It’s said that any single object should be made for one specific function.

So now you have all your layout in html file and the rest of the style in css files.

With this approach, you can easily reuse the same layout with a completely different style.

An important point for us is freedom.

It’s really important for us that you can use your preferred preprocessor or css methodology to the non-layout part of your style.

Thanks to our specific approach you can use the methodology and preprocessor you preferer to do this.

The doc is full of editable examples, so it’s very easy and interactive to learn to use NimbusCSS.

There are several examples for each component/attribute to show you how it works.

The doc is a cool first step but sometimes you need more concrete examples, it’s the reason why we created a showcase section.

The showcases section contains web page coded with NimbusCSS, the goal is to show some tips and patterns to build responsive layout easily.

We release some videos to show you step by step how to reproduce a specific website with NimbusCSS.

If you want to join a really cool community of Nimbus user’s you can join the discord group.

This is a really cool place where you will receive some help and tips.