Frontend Mentor's repositories
four-card-feature-section
A nice layout-based challenge for beginners. This will test anyone who is new to multi-column and responsive layouts.
manage-landing-page
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.
rock-paper-scissors
This challenge will seriously test your HTML, CSS and JavaScript skills. There's even a Rock, Paper, Scissors, Lizard, Spock version if you really want to challenge yourself.
room-homepage
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.
multi-step-form
An excellent test for your form-building and JS skills, this project will pose lots of challenges along the way to completion.
product-preview-card-component
This HTML & CSS-only challenge will be perfect for anyone starting to build responsive projects.
huddle-landing-page-with-curved-sections
Practice using pseudo-elements for styling extras and the CSS position property for the sections with curved edges.
rest-countries-api-with-color-theme-switcher
If you're wanting to test your JavaScript skills this is the challenge for you. Use whichever JS framework you prefer and pull data from the REST Countries API.
3-column-preview-card-component
This challenge is perfect if you're just starting. The shift between the layouts will be a nice test if you're new to building responsive projects.
age-calculator-app
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!
calculator-app
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!
ecommerce-product-page
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!
interactive-card-details-form
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.
intro-section-with-dropdown-navigation
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.
ip-address-tracker
In this challenge, you'll be using two separate APIs together to create an IP Address Tracking app.
news-homepage
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!
newsletter-sign-up-with-success-message
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.
notifications-page
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.
expenses-chart-component
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.
interactive-comments-section
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!
interactive-rating-component
This is a nice, small project to practice handling user interactions and updating the DOM. Perfect for anyone who has learned the basics of JavaScript!
results-summary-component
This challenge has something for everyone. It’s a HTML and CSS only project, but we’ve also provided a JSON file of the test results for anyone wanting to practice JS.
social-proof-section
This project will test your layout skills. If you're starting to get confident with Flexbox or Grid, this will provide a nice challenge!
static-job-listings
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.