Skip to content
  • Learning paths
  • Challenges
  • Solutions
  • Articles
  • Unlock Pro
  • Log in with GitHub
Challenges

Challenges

Unlock full access

  • Build our premium projects
  • Access all Figma design files
  • And much more!
Upgrade now

Work in a team? Upgrade your team to Pro

Newest to oldest

Showing 28 of 117 challenges

Not sure where to start? Try our learning paths

  • Premium

    Personal blog

    • HTML
    • CSS
    • JS
    3intermediate

    This multi-page personal blog project has a JSON file to practice working with dynamic data. You can even use a headless CMS to take the difficulty up a notch!

  • Premium

    Frontend Quiz app

    • HTML
    • CSS
    • JS
    3intermediate

    This app will test your skills (as well as your knowledge!) as you build out a fully functional quiz. We provide a local JSON file to help you practice working with JSON!

  • Premium

    Dictionary web app

    • HTML
    • CSS
    • JS
    • API
    3intermediate

    In this project, you'll integrate with the Dictionary API to create a real-world dictionary web app. Additional tests include colour themes and font selection.

  • Premium

    Password generator app

    • HTML
    • CSS
    • JS
    3intermediate

    This app will be an excellent test of your HTML, CSS, and JS skills. You'll build custom form controls and use JavaScript to generate random passwords.

  • Premium

    In-browser markdown editor

    • HTML
    • CSS
    • JS
    3intermediate

    In this project, you'll build a fully-functional in-browser markdown editor application with a light/dark mode toggle. It's also perfect to build as a full-stack app!

  • Premium

    Tic Tac Toe game

    • HTML
    • CSS
    • JS
    3intermediate

    This classic practice project for web developers is a great exercise to complete. It will test your HTML semantics, your grid layout skill, as well as your JS logic.

  • Free

    Interactive comments section

    • HTML
    • CSS
    • JS
    3intermediate

    This 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+

    Space tourism multi-page website

    • HTML
    • CSS
    • JS
    3intermediate

    This project is a fun collaboration with Scrimba and Kevin Powell! If you like, you can follow along and watch Kevin complete the project on Scrimba. Lots to learn!

  • Free

    E-commerce product page

    • HTML
    • CSS
    • JS
    3intermediate

    In 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!

  • Premium

    Galleria slideshow site

    • HTML
    • CSS
    • JS
    3intermediate

    This art gallery slideshow project will be a great test for your layout and JS skills. With the masonry layout, slideshow logic, and lightbox view there's a lot to build!

  • Premium

    Planets fact site

    • HTML
    • CSS
    • JS
    3intermediate

    In this challenge, you'll be building out an 8-page fact site for all planets in our solar system. This project will make an incredible portfolio piece when completed!

  • Free

    Calculator app

    • HTML
    • CSS
    • JS
    3intermediate

    This 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!

  • Premium

    Coffeeroasters subscription site

    • HTML
    • CSS
    • JS
    3intermediate

    This challenge will have you building a 3-page subscription site. As part of the project, you'll create an interactive subscription page to test your JS and logic skills!

  • Free

    Launch countdown timer

    • HTML
    • CSS
    • JS
    3intermediate

    This 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!

  • Premium

    Creative agency single-page site

    • HTML
    • CSS
    • JS
    3intermediate

    This challenge will put your layout skills to the test with lots of overlapping elements. If you're getting confident with your CSS layouts, this will be a great project!

  • Free

    Todo app

    • HTML
    • CSS
    • JS
    3intermediate

    The 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.

  • Premium

    Clock app

    • HTML
    • CSS
    • JS
    • API
    3intermediate

    This challenge will have you working with external APIs to set data based on a visitor's location. You'll also be using logic to set content depending on the time of day.

  • Free

    Room homepage

    • HTML
    • CSS
    • JS
    3intermediate

    This 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
    3intermediate

    In this challenge, you'll be using two separate APIs together to create an IP Address Tracking app.

  • Free

    Chat app CSS illustration

    • HTML
    • CSS
    3intermediate

    In 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!

  • Premium

    Scoot multi-page website

    • HTML
    • CSS
    • JS
    3intermediate

    This multi-page website will really test your front-end skills. There are 4 pages to build with mobile, tablet, and desktop designs included.

  • Premium

    Dine restaurant website

    • HTML
    • CSS
    • JS
    3intermediate

    This two-page website is perfect if you're starting to become more confident in your front-end skills. The challenge includes tricky design details and form validation.

  • Premium

    Minimalist portfolio website

    • HTML
    • CSS
    • JS
    3intermediate

    This multi-page portfolio site will be a great challenge to test your all-round front-end skills. You can even use the site as your own portfolio when you're finished!

  • Free

    Job listings with filtering

    • HTML
    • CSS
    • JS
    3intermediate

    In 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

    Digital bank landing page

    • HTML
    • CSS
    • JS
    3intermediate

    This 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
    3intermediate

    This 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
    3intermediate

    Integrate with the Clean URI link shortening API and play with browser storage in this landing page challenge.

  • Free

    Bookmark landing page

    • HTML
    • CSS
    • JS
    3intermediate

    This 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
Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Filters

Type

Difficulty

Languages