Thanks for checking out this front-end coding challenges list.
Frontend Mentor challenges allow you to improve your skills in a real-life workflow.
- Profile card component - HTML, CSS.
- Article preview component - HTML, CSS and a tiny bit of JavaScript.
- Huddle landing page with a single introductory section - HTML, CSS and a tiny bit of JavaScript.
- Ping single column coming soon page - HTML, SCSS and a tiny bit of JavaScript, in my solution add a thank you page for subscribers.
- Single price grid component - HTML, SCSS
- Intro component with sign-up form - Sign-up form complete with client-side validation using JavaScript.
- Base Apparel coming soon page - Basic form validation with JavaScript.
- Four card feature section - Multi-column and responsive layouts.
- Coding bootcamp testimonials slider - Great opportunity to play with animations and content transitions.
- FAQ accordion card - Building out an FAQ accordion.
- Social proof section - Built with Flexbox.
- https://photoshop.adobe.com/
- page-ruler-redux (extension)
- colorpick (extension)
- normalize.css
- Fonts
- sass
- main
- article
- color hsl
- flexbox
There are multiple places you can share your solution:
- Submit it on the platform so that other users will see your solution on the site. Here's our "Complete guide to submitting solutions" to help you do that.
- Share your solution page in the #finished-projects channel of the Slack community.
- Tweet @frontendmentor and mention @frontendmentor including the repo and live URLs in the tweet. We'd love to take a look at what you've built and help share it around.
Feedback is always welcome, so if you have any to give on this challenge please email hi[at]frontendmentor[dot]io.
This challenge is completely free. Please share it with anyone who will find it useful for practice.
Have fun building! 🚀