Challenges
Unlock full access
- Build our premium projects
- Access all Figma design files
- And much more!
Work in a team? Upgrade your team to Pro
Showing 13 of 118 challenges
Not sure where to start? Try our learning paths
- Free
Interactive comments section
- HTML
- CSS
- JS
3intermediateThis is project will put your JavaScript skills to the test. We provide a JSON file to pull the data, but it's also a perfect project to build as a full-stack CRUD app!
- Free
E-commerce product page
- HTML
- CSS
- JS
3intermediateIn this challenge, you'll build a beautiful product page. We'll be putting your JS skills to the test with a lightbox product gallery and cart functionality!
- Free
Calculator app
- HTML
- CSS
- JS
3intermediateThis calculator app will be a great test of your CSS and JS skills especially. If you're wanting to practice using Grid, this challenge will be perfect for you!
- Free
Launch countdown timer
- HTML
- CSS
- JS
3intermediateThis will be a fun one! Your challenge is to build this countdown timer. There are lots of small CSS tests in the design as well. So it should keep you busy!
- Free
Todo app
- HTML
- CSS
- JS
3intermediateThe classic todo app with a few twists! This app includes a dark/light theme toggle and drag & drop reordering for anyone wanting an extra test.
- Free
Room homepage
- HTML
- CSS
- JS
3intermediateThis small homepage challenge packs a big punch to test your layout skills. There's also a slider in there to add a JS layer for extra practice.
- Free
IP Address Tracker
- HTML
- CSS
- JS
- API
3intermediateIn this challenge, you'll be using two separate APIs together to create an IP Address Tracking app.
- Free
Chat app CSS illustration
- HTML
- CSS
3intermediateIn this challenge, you'll be building out the entire app illustration from scratch. This will seriously test your CSS skills. So give it a go if you feel confident!
- Free
Job listings with filtering
- HTML
- CSS
- JS
3intermediateIn this challenge, you'll be using JavaScript to filter out jobs based on selected categories. We provide a local JSON file to help you practice working with JSON data.
- Free
Easybank landing page
- HTML
- CSS
- JS
3intermediateThis challenge will provide a nice test for your layout skills. If you're ready to move up from Junior challenges, this one is a great next step.
- Free
Manage landing page
- HTML
- CSS
- JS
3intermediateThis challenge will be a great test for your responsive skills. There are lots of small details and slight content shifts for different screen sizes.
- Free
URL shortening API landing page
- HTML
- CSS
- JS
- API
3intermediateIntegrate with the Clean URI link shortening API and play with browser storage in this landing page challenge.
- Free
Bookmark landing page
- HTML
- CSS
- JS
3intermediateThis challenge will really test your layout skills. There are also areas that will require some JavaScript, such as the tabbed features section and the FAQ accordion.
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord