What Exactly Is Atomic CSS

The atomic css is also known to be the functional class.It is the kind of approach for CSS architecture and it favors the small, single-purpose classes with names that are based on visual function.It is an easy idea for using a singular CSS property, in return, allowing us to use that property on different elements by simply adding the classes in out HTML element.

Atomizer

For using the atomic css the popular way is by using it with Atomizer project by Yahoo.This has been seen the best and the fastest way of using the access and is good enough for quick prototyping.The real benefit of using atomizer is that it will add the class to our destination CSS files, means that only classes  defined  in HTML will be there in case, there will be no redundant styles
Variations of Atomic CSS

Static

Most of the atomic CSS is written in the same way as the case. It is very common for using a preprocessor for generating a library of classes with the set of variations that are used to define a unit-based design system for spacing, color, typography etc.The advantages of this style is it is familiar and it has a lower barrier to entry, and easily understood by the people that are not well versed in CSS

Programmatic

This approach includes using a build tool for automatically generating style based on the what it finds in HTML

Longhand/Shorthand

Longhand styles favor us with more readable class names, and shorthand provides us favors with the brevity

Related Terms

Utility classes
These classes can be easily understood and are single functioned classes that help us with the common styling patterns.eg(clearfix, hidden)

Immutable CSS

The aspect of atomic css is in which the utility classes never be modified, we are producing highly dependable results.Atomic CSS is all about shifting the complexities from stylesheets and into HTML.

Breakpoint Prefixing

This allows utility classes for overriding styles at the different breakpoints for making the implementation of the responsive web designs easy and efficient.