Content · Web Development · HTML

HTML color Attribute: Reference and Examples

A clear, practical attribute reference to color. Learn when to use it, see working HTML, and avoid common mistakes.

1 views Published Oct 19, 2026 Updated Oct 19, 2026 Admin

The color attribute is a small instruction attached to an HTML element. Its job is to legacy color setting; CSS is the modern approach. It is easier to remember when you can see it in a real piece of markup.

What color is used for


Legacy color setting; CSS is the modern approach. The attribute appears inside an element’s opening tag. Depending on its definition, it may take a specific string, a number, an enumerated keyword, or be a boolean attribute.

The example below uses it in a font context. Other elements may support it too, or may give the same attribute a different meaning.

Example you can try


<!-- Legacy approach (do not copy into a new project) -->
<font color="navy">Updated price</font>

<!-- Modern approach -->
<span style="color: navy;">Updated price</span>

How the example works


Look for color in the snippet. Here the example shows the value navy. This is a concrete input the browser can interpret; it is not just text shown to the reader.

The color attribute on the old font element is obsolete. Use CSS color instead.

Values and important behavior


Use the value format shown by the HTML definition. Do not assume that a value accepted in one attribute also works in another. When a browser ignores an invalid value, inspect the element and correct the markup.

This detail matters most when the page receives user input, navigates to another document, or loads an external resource. In those cases, check the browser behavior and any server-side requirements separately.

Small practice task


Copy the code and change color to another sensible value, or remove it entirely if it is optional. Test the difference in the browser and inspect any submitted value or network request.

Common Beginner Mistakes


  • The color attribute on the old font element is obsolete. Use CSS color instead.
  • Using color on an element that does not support it.
  • Believing that an HTML hint or client-side check replaces real server validation or a security policy.

Key Takeaways


  • color is used to legacy color setting; CSS is the modern approach.
  • The color attribute on the old font element is obsolete. Use CSS color instead.
  • Choose valid values and test the result instead of guessing what the browser will do.
Share this resourceSend this page to someone who may find it useful.