C4S CSS
Responsive
Responsive out-of-the-box, suitable for mobile-friendly designs 📱What is C4S?
C4S is a CSS library that lets you write HTML the way you want and frees you from having to write (almost) any custom CSS. The library is based on the functional CSS philosophy, also known as atomic CSS. You can click the links to learn more.
Learn C4S
Play this game to familiarize yourself with C4S class names using the spaced repetition learning technique 🤓
Get started
Getting started is very easy.
Follow the steps in the video and you'll be up-and-running in mere minutes 😀
Documentation
Examples List of rulesDownloads
Files
| Name | Size | Size gzip | Download | |
|---|---|---|---|---|
| c4s | 109 kB | 16.1 kB | Download | |
| c4s min minified | 77.8 kB | 14 kB | Download | |
| c4s-base | 38 kB | 7.85 kB | Download | |
| c4s-base min minified | 30.4 kB | 7.4 kB | Download | |
| c4s-s | 55.9 kB | 10.5 kB | Download | |
| c4s-s min minified | 42.3 kB | 9.24 kB | Download | |
| c4s-m | 55.9 kB | 10.5 kB | Download | |
| c4s-m min minified | 42.3 kB | 9.25 kB | Download | |
| c4s-l | 55.9 kB | 10.5 kB | Download | |
| c4s-l min minified | 42.3 kB | 9.25 kB | Download | |
| c4s-h | 55.9 kB | 10.5 kB | Download | |
| c4s-h min minified | 42.3 kB | 9.27 kB | Download | |
| c4s-p | 55.9 kB | 10.5 kB | Download | |
| c4s-p min minified | 42.3 kB | 9.27 kB | Download | |
| c4s-prefixed | 120 kB | 16.1 kB | Download | |
| c4s-prefixed min minified | 88.2 kB | 14.1 kB | Download | |
| c4s-forms | 114 kB | 17.2 kB | Download | |
| c4s-forms min minified | 81.8 kB | 15.1 kB | Download | |
| c4s-no-reset | 109 kB | 15.8 kB | Download | |
| c4s-no-reset min minified | 77.2 kB | 13.7 kB | Download |