Iris CSS started as a personal project to build the CSS framework of
my dreams.
I tried a huge number of CSS frameworks before. A few are really
worth mentioning by name: Pure.css, Skeleton, Pico CSS, Bootstrap
and Bulma. They all inspired me in different ways.
At some point I ended up with the following list of things I like
and dislike about CSS frameworks in general. If you agree with some
of the things mentioned below, Iris CSS might be a good fit for you.
What I don't
SCSS
Forces you to pollute HTML with lots of classes just to try it out.
Default font sizes and components that are too large or too small.
Lack of personality that makes the websites feel generic because
they all use the same top 5 frameworks.
Cryptic shorthand class names. I can understand the temptation in
a personal project to write iu-50 du mnb-3 us-er.
But why would you torture other people with that? It's a
rhetorical question, of course. Most of the time it is because
of the point below:
Creative methods to brag about the size of the framework. The
oldest salesman gimmick in the CSS book. In reality, what you
ship in production is often far away from what you started with.
Sometimes, the less the framework offers, the more extra classes
you end up adding to your custom CSS files. The sweet spot is
always somewhere in the middle.
Huge number of utility classes. I would like to have just the
right amount of utility classes, not too many but not too few, so
I can easily remember them.
Huge number of color shades (more than 11 per color family)
feels overwhelming and increases the time spent choosing the
right one.
Huge number of color shades but still lacking modern color
families that add more soul to the design like pink, emerald or
vermilion.
What I love
CSS
Works out of the box with no classes.
...but still has the right amount of optional utility classes.
Classes that are easy to remember and can be applied to most
elements instead of being overly specific only to certain
components.
Responsive everything
Light or dark mode
Good old plain CSS that matured nicely like a good bottle of wine
A comprehensive palette of color families.
Lots of button colors and styles. I love buttons!
Did I say I love colors?
A simple top nav bar component that is responsive and works out of the box.
A simple footer component.
The golden rule of simple components: if you can't set up a
component in one copy paste from the documentation, it's too
complicated for a framework core and it should go into a
components library.