Recently I had a project alongside my teammates where we ran into some issues and were able to finish it within the 2 last days of the 5 we had.
For a moment we thought we wouldn't have enough time to implement any decent CSS and so we would have been left with a page that looked like it came from the early 2000s.
Fortunately, with a little google fuu we came upon some wonderful libraries that were quick and easy to implement within our code.
Here are some example libraries that while we did not implement all of them, were amongst our choices.
Bulma CSS
One of Bulma's greatest features is its simple readable classes. The system for creating tiles is quick to be implemented and the code its self takes little time to understand.
Click here to be taken to Bulma's website.
Link to Github
Pure.CSS
Pure has small responsive CSS modules for whatever you could need. Layout and styling for your HTML elements are available. Its style is also minimal and has a very clean design. It is another perfect option for beginners.
Click here to be taken to Pure.CSS's website.
Link to Github
Animate.CSS
This is one of my favorites. It's simple and fast to incorporate within your HTML (or Javascript).
If you desire quick flashy fun on your webpage, Animate.CSS is perfect. Just remember to not overdo it(even though it may be fun).
Click here to be taken to Animate.CSS's website
Link to Github
Tailwind CSS
Tailwind has customizable building blocks. You won't have to worry about fighting set styles to override them. Instead of having predefined components, it gives you CSS helper classes to work. These classes allow you to create custom designs and in the end, you will have a much more personally designed website.
Click here to be taken to Tailwind CSS's website
Link to Github
Semantic UI
Semantic UI uses five descriptive categories for their re-usable UI components.
They are :
- UI Element
- UI Collection
- UI View
- UI Module
- UI Behavior
Almost every component has types, states and variations. A button can vary in size and color and can be formatted as a basic, social, fluid, toggle, and more. This gives you a great amount of flexibility in a component’s appearance.
Click here to be taken to Semantic UI's website
Link to Github
Top comments (1)
If you are still active on DEV, and would be kind enough to take a look, would you be willing to review my CSS library, Spark, and tell me if it's beginner friendly or not?
The goal is for the library to be beginner friendly, but I have no way to gauge that.