CSS challenges on Scrimba
Quick answer: Tutorials that only walk one topic in order rarely prepare you for “build this UI” tasks. This free ~2.6-hour pack makes you recreate patterns inspired by apps like GitHub, Codepen, and Instagram—plus loaders, progress bars, and more—in pure CSS, inside Scrimba’s editor.
We may earn a commission if you join Scrimba through our links.
Last reviewed: March 2026.
CSS Challenges
FreeFind out how well you really know CSS with our bumper-pack of challenges. Recreate components and layouts from popular applications like Github, Codepen, and Instagram, and build loading animations, p
View on Scrimba (opens in a new tab)About This Course
Find out how well you really know CSS with our bumper-pack of challenges. Recreate components and layouts from popular applications like Github, Codepen, and Instagram, and build loading animations, progress bars, flashcards and more using pure CSS!
This Intermediate-level course covers 2.6 hrs of content. It is available for free — no subscription required.
- Duration: 2.6 hrs
- Level: Intermediate
- Access: Free (no subscription required)
What Makes This Course Distinctive
Most courses teach one topic linearly. This one throws varied components at you so you stress-test selectors, layout, and animation tricks the way take-home tasks do. You rebuild recognizable patterns from popular products, which makes feedback obvious when something is off by a few pixels. Pure CSS constraints force you to understand what flex, grid, gradients, and keyframes can do without leaning on a framework. The interactive player keeps iteration fast when a challenge stalls. Strong follow-up after HTML and CSS or the crash course. Weak choice if you have not styled a box yet or need a gentle first week of CSS.
Prerequisites
Basic knowledge of HTML and CSS is recommended before starting this course.
Who Is This Course For?
- Best for: Intermediate learners who want dense practice and portfolio-worthy mini UIs without a single long narrative project.
- Not ideal if: You are brand new to CSS syntax. Complete a beginner HTML and CSS course first.
Part of These Learning Paths
Choose This If
- You want many distinct CSS puzzles instead of one slow tutorial arc.
- You copy solutions from Stack Overflow but cannot adapt them. These challenges force you to type and debug yourself.
- You want stronger pure CSS muscle for interviews, Frontend path projects, or open source UI work.
Related Courses
Practice & Learn More
- Practice CSS Grid
- Practice Flexbox
- Practice Tailwind CSS
- How Long Does It Take to Learn Coding?
- Scrimba vs Codecademy | All Comparisons
Related Pages
Yes—no Pro subscription required.
About 2.6 hours of challenges; pace depends how deep you go on each exercise.
Yes—if selectors and basic layout still feel shaky, start with HTML and CSS or the crash course.
Ready to Upgrade Your Learning?
Use our partner link to claim 20% off Scrimba Pro and unlock all courses and career paths.