After you learn the basics, building one thing teaches you more than watching ten things.
It feels harder, but it's how you build real skills.
After you learn the basics, building one thing teaches you more than watching ten things.
It feels harder, but it's how you build real skills.
If you'd like to see the types of projects we've helped fund, you can check out our public impact page here:
app.ecologi.com/impact/fron...
Frontend Mentor's climate impact: 40,222 trees funded and 58.41 tCOโe avoided, highlighting environmental contributions.
40,000 trees funded! ๐ณ
Every Frontend Mentor Pro subscription contributes to tree-planting and carbon-reduction projects through Ecologi. A massive thanks to our community of Pro members who have helped make this happen!
This is the next step in upgrading our solution reports before we move to a much more granular solution-scoring system that will even take factors like README and commit quality into account.
All the things potential employers would want to see in your projects!
Scores for an AI-enhanced report show performance metrics: Accessibility 8.3, HTML 7.0, CSS 7.5, JavaScript 5.9, overall 7.2/10.
We're currently working on adding scores to our AI-enhanced reports to help easily identify areas that are strong and those that need improvement in your solutions.
We hope you like the update and are excited to see our V2 solution reports! ๐
For anyone who wants to learn more about our reports, you can also read our "Introduction to Solution Reports" guide:
www.frontendmentor.io/guides/solu...
You can read the full announcement here:
www.frontendmentor.io/articles/ai...
To try it out, submit a new solution or regenerate a report on an existing one.
Pro members still get unlimited AI reports across all solutions.
This is stage 1 of our work to make solution reports much more comprehensive and actionable.
More coming soon.
We also removed screenshot credits.
Free members can now regenerate solution screenshots as many times as they need. Improved your solution? Get a fresh screenshot. No limits.
Our solution reports break down your code across HTML, CSS, JavaScript, and Accessibility.
The free static analysis is helpful, but AI-enhanced reports find up to 3x more issues AND highlight your strengths.
You get a much clearer picture of where to improve.
We just made AI-powered code reviews available to every free member on Frontend Mentor.
From today, every free member gets 2 AI report credits per month to get more detailed insights into their projects.
Here's what that means ๐
Your profile page has also been redesigned. There's a new private Progress tab with level tracking, activity charts, and a clear breakdown of what you need to reach the next level.
Progress tracker shows Level 3 with 378 out of 600 points. User is 222 points away from reaching Level 4.
There's a new 5-level progression system to help you track where you are in your learning journey.
Your level is based on both your points AND the hardest challenge you've completed. The goal is to help you understand when they might be ready to progress to the next level.
New challenge points by difficulty level: Level 1 Newbie gives 10 points, Level 2 Junior gives 25 points, Level 3 Intermediate gives 50 points, Level 4 Advanced gives 100 points, and Level 5 Guru gives 200 points.
New code review points by difficulty level: Helpful feedback on Newbie solutions gives 3 points, Junior gives 5 points, Intermediate gives 10 points, Advanced gives 20 points, and Guru gives 40 points.
Challenge points now scale exponentially to match real effort.
Newbie: 10
Junior: 25
Intermediate: 50
Advanced: 100
Guru: 200
Helpful code review points also scale with difficulty now. No more flat 20 points regardless of complexity.
We just shipped a big update to Frontend Mentor: new progression levels, fairer scoring, and a revamped profile page.
Here's what changed ๐งต
Glad you like it! ๐ฅณ
We just shipped Guides on Frontend Mentor! ๐
Everything you need to know about the platform, all in one place. From getting started to making the most of features like solution reports and learning paths.
Check it out here: www.frontendmentor.io/guides
Text outlines a project utilizing GitHub Copilot for debugging CSS, HTML accessibility, JavaScript verification, and improving styles.
We quietly added an 'AI Collaboration' section to our challenge starter README template last week.
It's great to see people already using it to outline how they worked with AI across our projects, which will make for excellent interview conversations!
Want to go deeper on learning effectively with AI?
Read our full guide: AI coding assistants for beginners
www.frontendmentor.io/articles/ai...
If you're already using AI tools with our challenges, you don't need to change anything. The files are already included automatically.
You can read more about the update here:
www.frontendmentor.io/articles/ag...
Nobody has figured out the best way to learn with AI yet. We're all working it out.
But we think setting sensible defaults in the starter code is a good step toward helping you get the most out of these tools while building real skills.
Intermediate: Experienced colleague. Discusses trade-offs, presents multiple approaches, lets you decide.
Advanced: Senior colleague. Challenges your thinking, plays devil's advocate, explores edge cases.
Guru: Peer collaborator. Debates approaches, brings contrarian viewpoints, references specs.
The instructions are tailored to each difficulty level:
Newbie: Patient mentor. Small steps, real-world analogies, multiple hints before revealing approaches.
Junior: Supportive guide. Introduces debugging techniques and explains the "why" behind concepts.
The core principle: AI should guide your thinking, not replace it.
The files are designed so AI tools help you work through problems step by step, building real understanding along the way.
AI coding tools like Cursor and GitHub Copilot look for instruction files in project directories.
By including AGENTS .md (and CLAUDE .md for Claude Code), we've set up your AI assistant to be a better learning partner from the moment you open a challenge.
We just added AGENTS .md files to every Frontend Mentor challenge!
These files tell AI coding tools how to help you learn, not just give you answers. And they're tailored to each difficulty level.
Here's what we did and why ๐งต
Congratulations, gbollybambam! Here's the winning submission for you all to try out:
www.frontendmentor.io/solutions/p...