Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Challenges

Junior

JS

free

  • NewFree

    Contact form

    • HTML
    • CSS
    • JS
    2junior

    Building accessible forms is a crucial task for front-end developers. This challenge will help you practice building a form with several input types and validation.

  • Free

    Newsletter sign-up form with success message

    • HTML
    • CSS
    • JS
    2junior

    This will test your skills with basic form structure, validation, and submission. The success state will also be an excellent opportunity to work with DOM manipulation.

  • Free

    Age calculator app

    • HTML
    • CSS
    • JS
    2junior

    This challenge is designed to sharpen your JavaScript and form validation skills. Working with dates in JavaScript can be tricky, so this will be a nice test!

  • Free

    News homepage

    • HTML
    • CSS
    • JS
    2junior

    This news homepage will be an excellent opportunity to practice your CSS Grid skills. There will be lots of tricky decisions to make and plenty of learning opportunities!

  • Free

    Notifications page

    • HTML
    • CSS
    • JS
    2junior

    This project will be a brilliant test of your HTML, CSS, and basic JavaScript skills. You'll use JS to toggle the visual state of the notifications.

  • Free

    Interactive card details form

    • HTML
    • CSS
    • JS
    2junior

    This fun project will be an excellent way to practice DOM manipulation and form validation while also putting your HTML and CSS skills to the test.

  • Free

    Expenses chart component

    • HTML
    • CSS
    • JS
    2junior

    In this challenge, you'll create a bar chart component from scratch. We provide a local JSON file, so you can add the chart data dynamically if you choose.

  • Free

    Intro section with dropdown navigation

    • HTML
    • CSS
    • JS
    2junior

    This challenge will test your ability to create dropdown navigation menus, a common pattern on larger sites. It will also provide some nice basic layout challenges.

  • Free

    Time tracking dashboard

    • HTML
    • CSS
    • JS
    2junior

    A perfect opportunity to practice your CSS Grid skills. For anyone wanting to take it up a notch, we provide a JSON data file to practice working with data.

  • Free

    Tip calculator app

    • HTML
    • CSS
    • JS
    2junior

    This small app is perfect for anyone starting to get to grips with JavaScript. The calculator functionality will be a nice test!

  • Free

    Sunnyside agency landing page

    • HTML
    • CSS
    • JS
    2junior

    This challenge will be a perfect test of your layout and responsive skills. There's a tiny bit of JS for the mobile menu, but the focus is HTML & CSS.

  • Free

    Blogr landing page

    • HTML
    • CSS
    • JS
    2junior

    Flex your layout muscles with this landing page challenge. You'll mostly be working with HTML & CSS for this project with a tiny bit of JS for the mobile menu.

  • Free

    Crowdfunding product page

    • HTML
    • CSS
    • JS
    2junior

    This challenge will test both your layout and state management skills. As visitors make pledges, your goal is to keep track of the changes.

  • Free

    Interactive pricing component

    • HTML
    • CSS
    • JS
    2junior

    In this project, you'll build out an interactive pricing component complete with custom range input slider and pricing toggle. A perfect way to test your JS skills!

  • Free

    Loopstudios landing page

    • HTML
    • CSS
    • JS
    2junior

    This challenge is perfect if you're looking to test your CSS Grid chops. Even without Grid, this project will be a fun one to help you practice your layout skills!

  • Free

    Coding bootcamp testimonials slider

    • HTML
    • CSS
    • JS
    2junior

    This challenge will be a nice test if you're new to JavaScript. It's also a great opportunity to play around with content animations and transitions.

  • Free

    Social media dashboard with theme switcher

    • HTML
    • CSS
    • JS
    2junior

    This challenge will be a perfect chance to practice your Grid skills. The color theme switcher also adds a nice additional test.

  • Free

    Insure landing page

    • HTML
    • CSS
    • JS
    2junior

    Test your layout skills with this HTML & CSS only landing page. This challenge is perfect if you're starting to get confident in laying out web pages.

  • Free

    Pricing component with toggle

    • HTML
    • CSS
    • JS
    2junior

    This challenge will get you thinking about building an accessible custom toggle control and also test your layout skills.

  • Free

    Project tracking intro component

    • HTML
    • CSS
    • JS
    2junior

    Some interesting layout and code challenges are baked into this design. Perfect if you're a beginner who is starting to get a bit more confident with your layouts.

  • Free

    Fylo dark theme landing page

    • HTML
    • CSS
    • JS
    2junior

    This design has some nice layout challenges in it. A perfect training ground to practice your Flexbox and/or Grid skills.

Discord logo

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