Free CSS resources you will love 😎😍
Tags: css, webdev
Published: 2021-03-30 13:20:30

1️⃣ Colors
    
   1. Color Hunt- [Color Hunt](https://colorhunt.co/)
   2. Coolors- [Coolors](https://t.co/ru2grgP3dU?amp=1)
   3. HTML color codes- [HTML color codes](https://t.co/R6KefKEfan?amp=1)
   4. UI Gradients- [UI Gradients](https://t.co/R6KefKEfan?amp=1)
   5. Gradient generator- [Gradient generator](https://t.co/Yr6pueoWgx?amp=1)
   6. Colors- [Colors](https://clrs.cc/)
   7. Radial Gradient- [Radial Gradient](https://t.co/dXbLFCmqYa?amp=1)
   
2️⃣ AI integrated color picker
   
   1. Khroma- [Khroma](http://khroma.co/)
   2. Eva Design System- [Eva Design System](https://colors.eva.design/)
   3. AI color generator- [AI color generator](https://hotpot.ai/color-generator)

3️⃣ Code Snippets
 
   1. Web tools- [Web tools](https://t.co/K9QzJeX1gd?amp=1)
   2. Little snippets- [Little snippets](https://t.co/2SwFXGH9Jq?amp=1)
   3. Enjoy CSS- [Enjoy CSS](https://t.co/MctBAib84T?amp=1)
   4. CSS Tricks- [CSS Tricks](https://t.co/DLt7cjx7UN?amp=1)
   5. CSS Deck- [CSS Deck](https://t.co/LcZYnipvCy?amp=1)
   6. Codepen- [Codepen](https://t.co/n0NfUDHipj?amp=1)
   7. Snipplr- [Snipplr](https://t.co/E0SJs2gkl8?amp=1)
   8. Code my UI- [Code my UI](https://t.co/N8NQLf8ehn?amp=1)

4️⃣ CSS generator
 
   1. Gradient generator- [Gradient generator](https://t.co/Yr6pueoWgx?amp=1)
   2. Pattern generator- [Pattern generator](https://t.co/NQuV7pxLIz?amp=1)
   3. Animation generator- [Animation generator](https://t.co/To2jx9zfsF?amp=1)
   4. Layout generator- [Layout generator](https://t.co/To2jx9zfsF?amp=1)
   5. Stripes generator- [Stripes generator](https://t.co/5uTPrwA5xD?amp=1)

5️⃣ GitHub Repo
   
   1. Awesome CSS- [Awesome CSS](https://t.co/Jdm7zVzg4Z?amp=1)
   2. 30 seconds of CSS- [30 seconds of CSS](https://t.co/S1o9QfwJPM?amp=1)
   3. CSS Protips- [CSS Protips](https://t.co/5haB2xTWuz?amp=1)
   4. Awesome flexbox- [Awesomw flexbox](https://t.co/plkIV609lg?amp=1)

6️⃣ Cheat Sheets

   1. I love Coding- [I love Coding](https://t.co/GzAFkNtYJ7?amp=1)
   2. Dev Hints- [Dev Hints](Dev Hints)
   3. Css CheatSheet- [Css CheatSheet](https://t.co/6zUS77fMcO?amp=1)
   4. Grid- [Grid](https://t.co/5DI0QQKlwg?amp=1)
   5. CSS Grid- [CSS Grid](https://t.co/1VIRO6GZkR?amp=1)
   6. Flex cheat sheet- [Flex cheat sheet](https://t.co/7FKg45qJLL?amp=1)
   7. Flex- [Flex](https://t.co/gqT6AjJvaH?amp=1)
   
7️⃣ Animation libraries

   1. Animate.css- [Animate.css](https://t.co/uY8xDjw6tx?amp=1)
   2. OBNOXIOUS.css- [OBNOXIOUS.css](https://t.co/AafAyhWXiS?amp=1)
   3. CSShake- [CSShake](https://t.co/Kxuz8vPSSq?amp=1)
   4. Anim XYZ- [Anim XYZ](https://t.co/4mo2DkFROp?amp=1)
   5. Animista- [Animista](https://t.co/N1UuMCedJS?amp=1)
   6. Hover.CSS- [Hover.CSS](https://t.co/L2WTqm5Les?amp=1)
   7. Magic- [Magic](https://t.co/4lrIa7PcHy?amp=1)

8️⃣ Learn by playing

   1. Grid Garden- [Grid Garden](https://t.co/kXOYx9fH4y?amp=1)
   2. Unfold- [Unfold](https://t.co/tmRyct6N3Q?amp=1)
   3. Flexbox defense- [Flexbox defense](https://t.co/L2tzQ7E3KR?amp=1)
   4. CSS Diner- [CSS Diner](https://t.co/6Tck4TYh33?amp=1)
   5. Flexbox froggy- [Flexbox froggy](https://t.co/JZBSPQgN7D?amp=1)

9️⃣ CSS Websites

   1. CSS reference- [CSS reference](https://t.co/qZk0IdSVJQ?amp=1)
   2. Learn to code- [Learn to code](https://t.co/bl2rx2HJTU?amp=1)
   3. CSS layouts- [CSS layouts](https://t.co/n4EGLSu12f?amp=1)
   4. CSS tutorial- [CSS tutorial](https://t.co/y9vAj5YbOM?amp=1)
   5. CSS tricks- [CSS tricks](https://t.co/EHtVAMno2H?amp=1)