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
    1. 2 Ways to Make Half-Colored Background Page Sections

      2 Ways to Make Half-Colored Background Page Sections

      Tutorial Beginner

      In this quick tutorial, you’ll learn two ways to split a page section’s background into two colors.

    2. How to Create an “AI Quotes Generator” With OpenAI and JavaScript

      How to Create an “AI Quotes Generator” With OpenAI and JavaScript

      Tutorial Intermediate

      In this tutorial, we’ll learn how to create an AI Quotes Generator app with JavaScript. This app will demonstrate how to fetch data from the OpenAI API and...

    3. How to Build a Text-to-Voice Application With JavaScript

      How to Build a Text-to-Voice Application With JavaScript

      Tutorial Beginner

      Let’s convert text into speech using JavaScript and the WebSpeechAPI. Our app will feature a simple interface where the user adds the text, then clicks a...

    4. How to Create a Simple Tip Calculator with HTML, CSS, and Vanilla JavaScript

      How to Create a Simple Tip Calculator with HTML, CSS, and Vanilla JavaScript

      Tutorial Intermediate

      In this tutorial, we will cover how to create a simple tip calculator with HTML, CSS, and JavaScript.

    5. Learn These Viewport-Relative CSS Units (100vh, 100dvh, 100lvh, 100svh)

      Learn These Viewport-Relative CSS Units (100vh, 100dvh, 100lvh, 100svh)

      Tutorial Beginner

      In this tutorial, we’ll cover the challenges when working with the classic 100vh unit for making full-screen sections and discuss some great alternative CSS...

    6. How to Create a 2D Digital Clock with HTML, CSS, and Vanilla JavaScript

      How to Create a 2D Digital Clock with HTML, CSS, and Vanilla JavaScript

      Tutorial Intermediate

      Wouldn’t it be fun to create your own beautiful Digital Clock with basic web technologies? This tutorial will cover how to create a faux-3D digital Clock...

    7. Create a Progress Stepper Component (Perfect for Forms)

      Create a Progress Stepper Component (Perfect for Forms)

      Tutorial Beginner

      A progress stepper component is a tool added in forms to streamline user interaction by breaking tasks into manageable steps. It offers straightforward...

    8. Create a Rotating Text Animation Effect With CSS Variables and JavaScript

      Create a Rotating Text Animation Effect With CSS Variables and JavaScript

      Tutorial Intermediate

      In this new tutorial, we’ll learn how to create a rotating text animation effect using CSS variables and JavaScript.

    9. How to Create an Emoji Rating Slider With JavaScript

      How to Create an Emoji Rating Slider With JavaScript

      Tutorial Beginner

      In this tutorial, we will use JavaScript to build a rating emoji component that will allow the user to rate their level of satisfaction by using a slider.

    10. Putting the ChatGPT Advanced Data Analysis to the Test (Can ChatGPT Code?)

      Putting the ChatGPT Advanced Data Analysis to the Test (Can ChatGPT Code?)

      Tutorial Beginner

      ChatGPT Advanced Data Analysis promises to be able to assess data, output graphs, analyze screenshots, and create website code. But does it do what it claims?

    11. Build an Infinite Blinking Text Animation With CSS and a Touch of JavaScript

      Build an Infinite Blinking Text Animation With CSS and a Touch of JavaScript

      Tutorial Intermediate

      In this new tutorial, we’ll learn how to create an infinite blinking/flashing/highlighting text effect with CSS animations and a bit of JavaScript.

    12. How to Integrate Bootstrap 5 Tabs With Chart.js

      How to Integrate Bootstrap 5 Tabs With Chart.js

      Tutorial Intermediate

      Today, you’ll learn how to incorporate charts generated by the Charts.js charting library into Bootstrap 5 tabs/pills.