Learn HTML/CSS

Learn the fundamentals of web design with our HTML and CSS tutorials. Build landing pages, apps, websites, and more, with animations and other advanced effects.

Getting started with HTML/CSS

  • Design and Code Your First Website in 9 Easy-to-Understand Steps

    Design and Code Your First Website in 9 Easy-to-Understand Steps

    Nathan Umoh
  • HTML & CSS for Beginners (MEGA Free Course!)

    HTML & CSS for Beginners (MEGA Free Course!)

    Adi Purdila
  • All HTML/CSS content:

    1. New Short Course: Interactive JavaScript Maps With Leaflet

      New Short Course: Interactive JavaScript Maps With Leaflet

      Tutorial Beginner

      Leaflet is a robust JavaScript framework for creating interactive maps on the web. Learn how to use it in our quick half-hour course, Interactive JavaScript...

    2. A Guide to Creating Accessible Animations

      A Guide to Creating Accessible Animations

      Tutorial Intermediate

      Creating accessible animations is an important part of user experience. Motion on the screen can make people dizzy, nauseous, or worse. In this guide, I’ll...

    3. Accessible SVG: Methods for Adding Alternative Content

      Accessible SVG: Methods for Adding Alternative Content

      Tutorial Beginner

      While there are many things to consider when making SVGs fully accessible, this article will focus on the ways you can add alternative content to an SVG.

    4. Best Practices for ARIA Implementation

      Best Practices for ARIA Implementation

      Tutorial Beginner

      Already familiar with how to add ARIA to your site from our other articles? Now find out when and why to use this accessibility extension to create a better...

    5. Accessible Apps: Barriers to Access and Getting Started With Accessibility

      Accessible Apps: Barriers to Access and Getting Started With Accessibility

      Tutorial Beginner

      The goal of accessibility is that your tool works for all people, wherever they fall on the spectrum of hearing, movement, visual, and cognitive ability....

    6. Create a CSS Grid Image Gallery (With Blur Effect and Interaction Media Queries)

      Create a CSS Grid Image Gallery (With Blur Effect and Interaction Media Queries)

      Tutorial Intermediate

      In this tutorial we’re going to take a bunch of ordinary thumbnail links and turn them into a responsive CSS grid gallery with a blurred hover effect. We’ll...

    7. Interactive JavaScript Maps With Leaflet

      Interactive JavaScript Maps With Leaflet

      Course Intermediate

      Leaflet is a robust JavaScript framework for creating interactive maps on the web. In this short course, I will teach you how to navigate this powerful...

    8. New Course: Using Figma for SVG Design

      New Course: Using Figma for SVG Design

      Tutorial Beginner

      In our new short course, Using Figma for SVG Design, you’ll learn how to use Figma for vector editing with SVG in mind, and how to generate SVGs that...

    9. How to Build a Full-Screen Responsive Page With Flexbox

      How to Build a Full-Screen Responsive Page With Flexbox

      Tutorial Intermediate

      In this tutorial, we’ll learn how to build a full-screen responsive page with flexbox. Our page will include a full-screen background image, vertically...

    10. Figma Vector Tips

      Figma Vector Tips

      Tutorial Beginner

      Vectors are an important part of any UI or prototyping design application, and Figma has its own powerful set of vector tools. Here are some quick tips and...

    11. Using Figma for SVG Design

      Using Figma for SVG Design

      Course Beginner

      Figma is becoming very well known as a UI design tool, but on top of its excellent performance in this arena, it is also becoming a favorite for its robust...

    12. How to Easily Animate SVGs With SVGator

      How to Easily Animate SVGs With SVGator

      Tutorial Beginner

      SVG animation is a great alternative to using animated GIFs on the web, but it’s not always easy. In this tutorial I’m going to explain how you can easily...