Scrimba CSS & Design Courses
Scrimba runs 12 CSS and design courses, from 29 minutes to 15.1 hours, covering layout, responsive design, Tailwind, animation, and visual UI design. Start with Learn HTML and CSS, the free 5.7-hour course every other one here assumes you already know.
Where to start
Learn HTML and CSS builds the foundation. From there, the layout pillars, Learn Flexbox and Learn CSS Grid, carry most modern layouts.
Scrimba also publishes a free written CSS reference (opens in a new tab) in its docs: a textbook counterpart to the scrims, with a Beginner, Intermediate, and Deep Dive switcher for each topic. Use it to look something up or reread a concept once you have moved past the basics.
Start Learn HTML and CSS for free (opens in a new tab)All CSS and design courses
| Course | Level | Access | Length |
|---|---|---|---|
| Learn HTML and CSS | Beginner | Free | 5.7 hrs |
| Learn Flexbox | Intermediate | Pro | 53 min |
| Learn CSS Grid | Intermediate | Pro | 1.1 hrs |
| Learn CSS Variables | Intermediate | Pro | 29 min |
| Learn CSS Animations | Intermediate | Pro | 2.0 hrs |
| Learn Responsive Web Design | Intermediate | Pro | 15.1 hrs |
| Learn Tailwind CSS | Intermediate | Pro | 2.2 hrs |
| Build a Product Card with Tailwind CSS | Intermediate | Pro | 1.3 hrs |
| Learn Bootstrap | Intermediate | Pro | 56 min |
| CSS Challenges | Intermediate | Pro | 2.6 hrs |
| Intro to UI Design Fundamentals | Intermediate | Free | 1.2 hrs |
| Learn UI Design | Intermediate | Pro | 8.6 hrs |
Inside the courses
From the full reviews:
- Learn HTML and CSS: free except three Pro solo projects.
- Learn CSS Grid: the BBC News clone solo project has no walkthrough.
- Learn Responsive Web Design: 175 lessons, four free.
- Learn Tailwind CSS: module 2 is five mockup challenges.
- Learn Bootstrap: loads Bootstrap 4.0.0 from 2018, not 5.
- Learn UI Design: roughly 45 of its 100 scrims are challenges.
How to progress
Run Learn HTML and CSS, then the layout pillars Learn Flexbox and Learn CSS Grid. Follow with Learn Responsive Web Design, the deepest course here, and Learn Tailwind CSS since Tailwind is the default for new React and Next.js work. If you want the designer's eye and not just the syntax, finish with Learn UI Design.
Where it fits
CSS is the front half of the Frontend Developer Path and feeds into the Fullstack Developer Path. Browse every track on the Learning Paths hub.
Related
- React courses, JavaScript courses, and all courses
- Practice CSS Grid, practice Flexbox, and practice Tailwind CSS
- Scrimba pricing
Get the full CSS and design track
Free HTML and CSS gets you started. Pro unlocks the responsive bootcamp, Tailwind, animations, and the UI design course.