Core Coursework

Take these in order

Prerequisite: There are no prerequisites for this learning path, but you should have some familiarity with computers and the Internet

Editor's Note

Without CSS, the internet would be a dull place to browse. Use CSS to add layout and visual style so your websites are functional and beautiful!

Jen Kramer

AnnieCannons

Get to know CSS in the right way without the fluff. You'll style text, build navigation bars, headers/footers, add icons, and more!

3 hours, 19 minutes CC

Watch Free Preview Get Full Access

Editor's Note

Reinforce your CSS fundamentals and go beyond the basics by applying modern styling techniques to a variety of responsive layouts.

Emma Bostian

Spotify

Fast-track your CSS learning to build professional, responsive websites. Master core concepts and practical layouts with Flexbox and Grid through engaging hands-on exercises.

3 hours, 56 minutes CC

Watch Free Preview Get Full Access

Editor's Note

An essential part of building a website is laying out the design. Jen teaches you to modern techniques for implementing designs using CSS Grid, Flexbox, Subgrid, Container Queries, and responsive images.

Ultimate CSS Grid & Layout Techniques, v3

Jen Kramer

AnnieCannons

CSS Grid is the most important tool in a modern web developer's toolkit for laying out web pages. Learn advanced techniques including subgrid, container queries, and responsive images through hands-on CodePen exercises.

6 hours, 21 minutes CC

Watch Free Preview Get Full Access

Ultimate CSS Grid & Layout Techniques, v3

Editor's Note

Put your CSS knowledge to practice building three variations of the same website. Each variation increases in complexity and allows you to think through a solution to each approach.

Practical CSS Layouts

Jen Kramer

AnnieCannons

Learn to code complex layouts with CSS Grid and Flexbox and tackle real-world exercises like styling buttons, audio players, hamburger menus, and lists.

8 hours, 58 minutes CC

Watch Free Preview Get Full Access

Editor's Note

CSS Animations are incredibly powerful and a crucial part of web design. They communicate intent and provide added context.

CSS Animations and Transitions

David Khourshid

Microsoft

Learn CSS transitions, animations, custom properties, data attributes, choreography, animation states, layout animations, and reactive animations with a little bit of JavaScript.

4 hours, 14 minutes CC

Watch Free Preview Get Full Access

Editor's Note

Broaden your vocabulary with more HTML elements and CSS properties. Complex CSS selectors make your styles more resilient and reusable.

Intermediate HTML & CSS

Jen Kramer

AnnieCannons

Learn modern CSS selectors like :is(), :where(), and :has() and discover new HTML elements and CSS Selectors that you might not know!

5 hours, 37 minutes CC

Watch Free Preview Get Full Access

Editor's Note

Reinforce your CSS skills with this project-based course by coding five challenging layouts.

CSS Projects

Jen Kramer

AnnieCannons

Looking to practice your CSS skills? Work through five distinct projects to practice writing semantic HTML, mobile-first designs, media queries, and CSS layout techniques.

5 hours, 1 minute CC

Watch Free Preview Get Full Access

Editor's Note

You now have all the tools necessary to take on the most challenging CSS designs. Dig deeper into CSS and learn additional techniques with the optional courses below.