• • HTML
  • CSS

  Pricing component with toggle

  This challenge will get you thinking about building an accessible custom toggle control and also test your layout skills.

  Junior

  View challenge
• • HTML
  • CSS
  • JS

  Rock, Paper, Scissors game

  This challenge will test your HTML, CSS and JavaScript skills. There's even a Rock, Paper, Scissors, Lizard, Spock version if you really want to challenge yourself.

  Advanced

  View challenge
• • HTML
  • CSS
  • JS
  • API

  URL shortening API landing page

  Integrate with the rel.ink URL shortening API and play with browser storage in this landing page challenge.

  Intermediate

  View challenge
• • HTML
  • CSS

  Four card feature section

  A nice layout-based challenge for beginners. This will test anyone who is new to multi-column and responsive layouts.

  Newbie

  View challenge
• • HTML
  • CSS
  • JS

  Base Apparel coming soon page

  This layout looks simple enough, but there are some interesting details to it that will test your CSS skills. You'll also get to practice basic form validation.

  Newbie

  View challenge
• • HTML
  • CSS

  Project tracking intro component

  Some interesting layout and code challenges are baked into this design. Perfect if you're a beginner who is starting to get a bit more confident with your layouts.

  Junior

  View challenge
• • HTML
  • CSS
  • JS

  Bookmark landing page

  This challenge will really test your layout skills. There are also areas that will require some JavaScript, such as the tabbed features section and the FAQ accordion.

  Intermediate

  View challenge
• • HTML
  • CSS
  • JS

  Intro component with sign-up form

  Practice building out a sign-up form complete with client-side validation using JavaScript.

  Newbie

  View challenge
• • HTML
  • CSS

  Single price grid component

  In this challenge, you will build out the pricing component to the designs provided. This is perfect for beginners and people who want to complete a smaller challenge.

  Newbie

  View challenge
• • HTML
  • CSS

  Clipboard landing page

  Put your layout skills to the test with this HTML & CSS landing page challenge. This challenge includes a design for hover states.

  Junior

  View challenge
• • HTML
  • CSS
  • JS

  Ping single column coming soon page

  This challenge is great for beginners and offers a chance to practice basic client-side form validation.

  Newbie

  View challenge
• • HTML
  • CSS
  • JS
  • API

  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.

  Advanced

  View challenge
• • HTML
  • CSS

  Huddle landing page with alternating feature blocks

  This challenge is perfect if you're wanting to practice your layout skills. If you're starting to get a bit more confident laying out a web page, give this project a go.

  Newbie

  View challenge
• • HTML
  • CSS

  Fylo dark theme landing page

  This design has some nice layout challenges in it. A perfect training ground to practice your Flexbox and/or Grid skills.

  Junior

  View challenge
• • HTML
  • CSS

  Huddle landing page with single introductory section

  A perfect challenge for beginners, this project will get you working with a two column layout.

  Newbie

  View challenge
• • HTML
  • CSS

  Fylo landing page with two column layout

  This project is great if you're starting to get confident with slightly more complex layouts. The second section with the testimonial area will provide a nice challenge.

  Newbie

  View challenge
• • HTML
  • CSS

  Huddle landing page with curved sections

  Practice using pseudo-elements for styling extras and the CSS position property for the sections with curved edges.

  Junior

  View challenge