The skill matrix
you can
actually play

We’ve turned Junior, Middle, and Senior skill requirements into visual CSS challenges.

Play through them to build the skills your next level requires.

Play your first challenge
Flexbox challenge: compare the current layout with the target and check your result.

Visual challenges
to level up your skills

See the target, change the code, and compare your result. As you progress from Junior to Middle and Senior, the challenges get tougher—and your skills grow.

Start with the basics or jump into harder challenges if you already have experience.

Try CSS Grid
CSS Grid challenge: turn a column of coloured blocks into a grid matching the target.

Build the skills
for your next
career move

Use the Skills Matrix to focus your practice on the skills your next role or project demands.

  • Move up in your career

    Build the skills to take on more responsibility, prepare for your next role, and strengthen your case for higher pay.

  • Take on more challenging projects

    Go beyond familiar tasks. Practise solving more demanding layout problems so you can take on work that stretches your skills.

  • Prepare for your first role

    Turn the basics into practical skills for your first internship, junior role, or freelance project.

    New to coding? Start with our interactive courses ↓

Built on years of hands-on learning

Across HTML Academy’s interactive courses and the Skills Matrix.

  • 240,000+learners
  • 1,100+coding exercises
  • 6,000,000+exercises completed

New to coding?
Start here

Start learning HTML, CSS, and JavaScript for free. Our in-depth interactive courses, created by experienced developers, guide you from your first line of code to building complete web pages.

Explore courses

  • No experience needed

    Start with the basics and build your skills step by step. There’s plenty to explore as you grow.

  • Learn from the experts

    Work through clear explanations and practical exercises designed by experienced developers. Write real code and see the results in your browser.

  • Learn at your own pace

    Repeat an exercise, revisit a topic, or take a break. Pick up where you left off whenever you’re ready.

Small steps. Real progress

What learners say about our interactive courses.

  • The theory is very easy to understand, much more interesting than video lessons.

    Daniel W.

  • It’s a great feeling when you realize that you edited something on the website with your own hands.

    Claire M.

Your first challenge is ready

Start with Flexbox. Change the code, match the target, and see what you can do.

Play your first challenge