CSS Visual Styling
Learn fonts, typography, colors, backgrounds, filters, units, and calc()

Join the AI Workshop to learn more about AI and how it can be applied to web development. Next cohort February 1st, 2026

The AI-first Web Development BOOTCAMP cohort starts February 24th, 2026. 10 weeks of intensive training and hands-on projects.


Visual styling is where CSS really shines, allowing you to transform plain HTML into beautiful, engaging designs. From typography to colors to backgrounds, CSS gives you complete control over how your content looks.

In this unit, you’ll learn the visual styling capabilities of CSS. We’ll cover working with fonts and typography, using colors effectively, creating backgrounds and gradients, adding borders and shadows, and other visual effects that bring your designs to life.

Mastering visual styling helps you create websites that are not only functional but also visually appealing and professional.

Lessons in this unit:

0: ▶︎ Introduction
1: How to Work with CSS Fonts
2: How to Style Text with CSS Typography
3: How to Use CSS Colors
4: How to Use CSS Backgrounds
5: How to Use CSS Filters
6: How to Use CSS Units
7: How to Use the CSS calc() Function
8: How to use Google Fonts
9: RGB color codes