Typography and color are two of the most visible decisions you make in CSS. Font family, font size, font weight, line height, and text alignment determine whether a block of text is comfortable to read or exhausting to look at, and color determines contrast, mood, and whether a visitor can read your content at all. These are not decorative afterthoughts — they are the properties you will reach for first when you begin styling any page.
In this topic you will work with two related skill sets. The first is text styling: choosing a font stack with font-family, setting size and weight, adjusting line-height for readable spacing between lines, and controlling alignment with text-align. The second is color: naming a color with a keyword like red or steelblue, specifying it precisely with a hex code such as #3366FF, or building it from channel values with rgb() and rgba() notation. You will apply those color values to both the color property (text) and the background-color property (the area behind it).
As you watch the videos below, pay attention to syntax details that trip students up: the comma-separated fallback list in font-family, the unitless number often used for line-height, the # prefix and six-digit pattern of hex codes, and the 0–255 range of each RGB channel. Also notice that every color value in these videos ultimately describes the same thing — the formats are interchangeable, so you can choose the one that fits your workflow. Keep contrast between text color and background color in mind throughout; it is the practical reason these two subtopics are taught together.
A short beginner introduction to color in CSS from the W3Schools video series. Based on the W3Schools CSS Colors reference pages, it should walk through how colors are specified in CSS and how those values are written into style rules. Expect coverage of the basic color formats you will use in your own stylesheets.
W3Schools is the reference most beginning web developers use daily, so this video matches the documentation you will likely consult while coding, and its three-minute length makes it an efficient entry point to the named-value, hex, and RGB subtopics.
A concise overview from Udacity of the typography tools CSS gives you for styling text on a page. It is framed around the range of text-related properties available, which is exactly the font-family, size, weight, and spacing territory of this topic. Treat it as a map of what is possible before you practice the individual properties.
Udacity produces structured instructional content for developers, and this video gathers the typography subtopics into one short survey, which helps you see how font and text properties work together rather than as isolated rules.
A longer, more explanatory video that compares the different ways of writing a color value in CSS — hex, RGB, and HSLA — and discusses when you might choose one over another. As part of a project-based series, it is likely to show these values being used in real stylesheet code. The added HSLA material goes slightly beyond this topic but reinforces how all color notations relate.
This is the clearest fit for the hex-versus-RGB subtopics because it directly contrasts the notations instead of simply listing them, helping you understand that the formats are different ways of expressing the same color.
These videos support MO5 most directly: producing a cohesive, fully styled page requires confident control of typography and color inside your external stylesheet, and the Udacity typography overview plus the two color videos give you the property vocabulary to do that. They also reinforce MO2, since every font and color declaration demonstrated must be attached to an element, class, or ID selector and may be overridden by the cascade — watching how these rules are written gives you more realistic material to reason about specificity with. Finally, the text-spacing properties covered here (line-height in particular) connect to the spacing concerns of MO3, where margin and padding control the space around elements rather than within the text itself.
These videos were chosen from YouTube on October 3, 2026. Each has captions; the player turns them on. Videos on YouTube can be changed or removed — if one no longer plays, tell your instructor. If a player does not appear, use its Watch on YouTube link.