Design briefs for practice and portfolio

Level up your frontend development skills with real-world examples.

Browse through and participate in free frontend challenges to elevate your HTML, CSS and JavaScript skills. The quality designs you’ll build through out these challanges will improve your design/development skills, as well as give you something to show off in your portfolio. Whether you’re a beginner frontend developer or advanced, there’s a challenge for you. Stuck? View challenge hints, walkthroughs, solutions and tutorials.

Daily Frontend Challenge

Receive a free frontend challenge in your inbox everyday, for 30 days. Your path to becoming a better frontend dev.

Browse Frontend challenges

Beginner

css card design tri card shadow and hover effects

CSS tri card design

This clean CSS cards design features three cards, with the center card stacked atop the others. There’s also a drop shadow and button/shadow hover effects

HTML

CSS

View Challenge
View Solution

Beginner

css card design tri card shadow and hover effects

CSS tri card design

This clean CSS cards design features three cards, with the center card stacked atop the others. There’s also a drop shadow and button/shadow hover effects

HTML

CSS

View Challenge
View Solution

Beginner

css card design tri card shadow and hover effects

CSS tri card design

This clean CSS cards design features three cards, with the center card stacked atop the others. There’s also a drop shadow and button/shadow hover effects

HTML

CSS

View Challenge
View Solution