CSS Named Color Reference

Blue

Blue·#0000FF

Blue is the canonical CSS named blue at #0000FF. It is more saturated and absolute than Royal Blue, making it useful when you need a direct digital primary, a legacy web reference, or an unmistakable link-state blue.

Recommended text colorWhite text
Body text pairing8.59:1
Strongest RoleDirect digital primary, links, and explicit system states
Generate PaletteOpen Converter

Technical Values

Exact numeric values for cross-tool conversion, token mapping, and accessibility review.

HEX#0000FFPrimary token
RGB0, 0, 255Screen values
HSL240, 100%, 50%Hue and lightness
CMYK100, 100, 0, 0Print handoff
LAB32, 79, -108Perceptual reference

Tonal Direction

Scan the ramp from light to dark to judge how Blue behaves across action states, layered surfaces, and supporting accents.

100#D1D1FF
300#8A8AFF
500#2E2EFF
600#0000FF
800#0000B8

Contrast & Interface Preview

Not every foreground and background pairing behaves the same. Use these checks to decide when white text, dark text, or the color itself should take the lead.

White text on this color

Best for reversed buttons, tabs, badges, and filled action surfaces.

8.59:1AAA-level contrast

Dark text on this color

Works for larger headings and selective UI blocks, but not for dense body copy.

2.00:1Needs more separation

This color on light surface

Use this pairing when Blue becomes the link, icon, border, or emphasis color on very light surfaces.

8.16:1AAA-level contrast
Recommended text colorWhite text

White text reaches 8.59:1 against Blue, which is strong enough for body text and standard action surfaces.

Where This Color Works

  • Use Blue when you need the most recognizable digital blue for links, status emphasis, or explicit system feedback.
  • Because #0000FF is fully saturated, it is stronger than Royal Blue on large surfaces and usually works better in smaller, focused interface roles.
  • Pair it with white, ink-dark neutrals, and lighter supporting blues if you want to keep the system sharp without making the whole UI feel harsh.

Reference Context

Color Notes

Blue is sourced from the published CSS Standard Colors library and retained here as a searchable reference swatch for product, interface, and branding work.

Hue Family

Trust-building blues for enterprise and SaaS.

Source Library
CSS Named Colors

Related Blues

Royal Blue

Royal Blue

#4169E1·CSS Standard Colors

Dodger Blue

Dodger Blue

#1E90FF·CSS Standard Colors

Cornflower Blue

Cornflower Blue

#6495ED·CSS Standard Colors

Tailwind Blue 500

Tailwind Blue 500

#3B82F6·Tailwind CSS Colors

Ant Design Blue 6

Ant Design Blue 6

#1677FF·Ant Design Colors

Palette Starting Points

Blueberry Voltage

Open Palette Library

Blue Obsidian Supernova

Open Palette Library

Aurora Coast

Open Palette Library

Implementation Snippets

Reference-ready snippets for CSS variables, utility-first styling, and token exports.

CSS Variables
:root {
  --color-blue: #0000FF;
  --color-blue-rgb: 0 0 255;
}

Drop into a global token file or CSS variable layer.

Utility Class
class="bg-[#0000FF] text-white"
class="hover:bg-[#0000B8] ring-1 ring-[#0000FF]"

Direct utility usage for a fast prototype or content block.

JSON Token
{
  "blue": "#0000FF",
  "blueRgb": [0, 0, 255],
  "blueHsl": [240, 100, 50]
}

Useful for design token exports and API-driven theme objects.

Move This Color Into the Workflow

Carry Blue into conversion, brand palette generation, and palette exploration workflows to test how it behaves across interface scenarios.

Generate PaletteBrowse More Colors