Skip to content
  • Unlock Pro
  • Log in with GitHub
For learners

Front-end and full-stack coding challenges that build real skills and help get you hired

Frontend Mentor provides professional design-to-code challenges that mirror real-world development work. Join 1,068,946 developers building portfolio projects that impress employers.

Start building freeBrowse challenges
Design mockup, mobile site, and code editor

Testimonials

"I highly recommend Frontend Mentor. Skip the search for project ideas and dive into ready-made challenges that help you level up as a developer."

Kevin PowellWeb Developer & YouTuber

"Frontend Mentor is a win-win. You can sharpen your skills building websites and add finished projects to your portfolio to help land a job!"

Jessica ChanWeb Developer & YouTuber

As featured on...

CSS Tricks
Stack Overflow
Product Hunt

How it works

1
Choose your challenge

Pick from 100+ professionally designed projects across five skill levels—from HTML/CSS basics to full-stack applications.

2
Code the design

Build responsive websites and web apps using the provided designs as your guide. Practice with any tools, frameworks, or AI assistants you want to master.

3
Submit and improve

Get automated feedback, community code reviews, and compare your solution to the design. Refine your approach and level up with each project.

4
Help others grow

Review other developers' code to sharpen your skills and build connections in our supportive community.

Why developers choose Frontend Mentor

Landing page in desktop and mobile views with icons of various popular front-end technologies

Move beyond passive learning

Stop watching and start creating. Build professional-quality projects that develop genuine coding skills through hands-on practice.

Landing pages and dashboards of several full-stack projects

Create a portfolio that gets you hired

Build impressive projects with professional designs. Recruiters tell us these portfolio pieces consistently "wow" them in interviews by demonstrating real-world capabilities.

Code editor with AI chat and icons of a few popular AI tools

Master AI-powered development workflows

Practice with AI tools that 76% of developers use daily. Learn to work effectively with Cursor, GitHub Copilot, ChatGPT, and other assistants while maintaining code quality and problem-solving skills.

Feedback from a few users on a solution another user submitted

Join a supportive developer community

Connect with peers for code reviews, career advice, and friendship. Beat imposter syndrome alongside developers who understand your journey, guided by mentors who've walked this path.

Ready to accelerate your growth? Go Pro

  • Build portfolio projects that get you hired

    Create multi-page websites, interactive dashboards, and full-stack applications that make your portfolio stand out to employers.

  • Get instant feedback on every submission

    Our AI-enhanced reports spot up to 3x more improvement opportunities than our standard reports, accelerating your growth without waiting.

  • Master the design-to-code workflow pros use

    Work with exact specs from Figma files—colors, spacing, fonts, and components—just like professional developers.

Plans

Monthly
$12/mo
Billed monthly
Learn more
  • Free challenges (included)
  • 5 Figma design files/month (included)
  • 2 premium challenges/month (included)
  • AI-enhanced solution reports (included)
  • Unlimited solution screenshots (included)
  • Private solutions (included)
  • Custom solution domains (included)
  • View challenges solutions early (included)
Best value
Yearly
$8/mo
$96 billed yearly (save 33% vs monthly)
Learn more
  • Free challenges (included)
  • Unlimited Figma design files (included)
  • Unlimited premium challenges (included)
  • AI-enhanced solution reports (included)
  • Unlimited solution screenshots (included)
  • Private solutions (included)
  • Custom solution domains (included)
  • View challenges solutions early (included)

Accepted payment methods

  • Visa
  • MasterCard
  • American Express
  • Maestro
  • PayPal
  • Google Pay

For companies

Frontend Mentor for Teams platform interface showing project management for engineering teams
Engineering teams

Train junior developers with real projects

Skip theoretical tutorials. Give your junior developers 100+ real-world challenges that build practical skills faster than traditional training programs.

Explore teams
Frontend Mentor Hiring platform interface showing developer profiles and skills assessment
Hiring teams

Discover junior talent through skills, not resumes

See real code and live projects upfront, then connect directly with developers who've demonstrated the skills and passion you need.

Explore hiring

A little ❤️ from our community

  • This platform provides everything developers need to improve their skills. The community is great, and the challenges keep me motivated, instill accountability through regular submissions, and allow me to build a professional portfolio by showcasing diverse projects.
    Francesca@frrann
  • Frontend Mentor eliminated the hurdle of sourcing designs, letting me focus on development. Their professional projects, especially in the Pro subscription, challenge me to create complex, multi-page websites. With a supportive community and feedback from advanced programmers, my skills have been elevated to new heights.
    Alfie@alfiemitchell123
  • Frontend Mentor transformed me from a newbie to a professional developer, enabling me to create flawless, responsive, accessible websites. It’s a superb platform for feedback with a supportive community backing your growth. Through it, I evolved from a frontend to a full-stack developer.
    Hikmah@Hikmahx
  • Frontend Mentor has helped tremendously. Working on the newbie challenges really helped me get better at building layouts. Also, it increased my JavaScript skills. Working with APIs, DOM manipulation, and so on greatly increased my knowledge. Would totally recommend it.
    Nuel@ijklmopffs
  • After completing a software bootcamp, Frontend Mentor let me build real-world projects, strengthening my developer skills. I wouldn’t be where I am today without it.
    Michelle@maberizk
  • As a backend developer, I sought to improve my frontend skills. Frontend Mentor provided beautifully designed challenges, allowing me to progress from simple components to advanced responsive web pages. Enough can’t be said about the community members. Their feedback has been invaluable in my journey to becoming a better developer.
    Arturo@artimys
  • Frontend Mentor offers invaluable real-world web development challenges, sharpening my HTML, CSS, and JavaScript skills. The structured feedback, solutions, and vibrant community have significantly impacted my learning and growth. It’s both a skill-building platform and a community hub for web developers.
    Shashikant@shashikantdev3
  • I began my frontend journey with Frontend Mentor’s newbie challenges and progressed to more complex projects. Some of the complex ones are now even in my portfolio! The supportive community and the dedication of the Frontend Mentor team are unmatched. I highly recommend it for newcomers and those keen on improving their skills.
    Marit@Maritxx

Join 1,068,946 people building portfolio-worthy projects

Our highly supportive, positive community is here to help you improve your skills. We all try to help each other out wherever possible. We’d love to welcome you to our community!

Log in with GitHub

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

We could not log you in

An existing Frontend Mentor account already uses your GitHub username or primary email address.

This usually occurs if you delete your old GitHub account and create a new one with the same details.