Blue color guide
HEX
#0000FF
RGB
0, 0, 255
HSL
240°, 100%, 50%
HSV
240°, 100%, 100%
Pure blue (#0000FF) is full blue channel with no red or green in sRGB, making it the maximally "default" blue in digital systems — hyperlink blue's cousin in many user mental models. That purity often makes it feel borrowed from OS chrome rather than bespoke to a brand, especially in flat planes beside neutrals. Compared with softer cornflower or steel blues, #0000FF is darker and more saturated; compared with cyan-leaning blues, it stays firmly in the straight-blue to blue-violet zone instead of drifting toward aqua.
Best for
Trade show graphics, signage, and booth displays.
Accessibility
White text on blue passes AAA at 8.59:1, so it is safe for dark backgrounds and section headers.
How does blue compare to nearby colors?
What is the difference between blue and navy blue?
Side by side, Blue (#0000FF) carries more lift and air than Navy Blue (#000080). Blue shifts the system toward paper, tint, and background behavior more than Navy Blue does. Use blue when you want more daylight in the palette, and move to navy blue when the layout needs the family to carry more presence.
What color is blue?
RGB blue at full intensity is foundational in additive color displays and appears constantly in early web defaults, debug graphics, and color-picker corners. Screen #0000FF is primarily a digital baseline rather than a print standard — print blues rely on ink-defined systems like Pantone or ISO specifications.
What is the hex code for blue?
| Format | Value |
|---|---|
| HEX | #0000FF |
| RGB | rgb(0, 0, 255) |
| HSL | hsl(240°, 100%, 50%) |
| HSV / HSB | hsv(240°, 100%, 100%) |
| CMYK (approx.) | cmyk(100%, 100%, 0%, 0%) |
Convert Blue to other color formats
Open the color converter with Blue (#0000FF) prefilled to copy RGB, HSL, HSV, CMYK, or OKLCH values.
Convert Blue in the color converter →What does blue mean in design?
In Western UI patterns, saturated blues are often associated with links, selections, and system affordances, so #0000FF can feel familiar to the point of anonymity. It tends to read as stable and direct in data graphics when used as a single series color. Next to purples or teals, it reads as the "straight" blue without the mystery of violet or the freshness of cyan.
How do I use blue in code?
| CSS (hex) | color: #0000FF; |
| CSS (rgb) | color: rgb(0, 0, 255); |
| CSS (hsl) | color: hsl(240, 100%, 50%); |
| RGB % | rgb(0%, 0%, 100%) |
| Tailwind | text-[#0000FF] |
| SwiftUI | Color(red: 0.000, green: 0.000, blue: 1.000) |
| UIKit | UIColor(red: 0.000, green: 0.000, blue: 1.000, alpha: 1.0) |
| Android | Color.rgb(0, 0, 255) |
| Compose | Color(0xFF0000FF) |
| Web Safe | #0000FF |
Is blue accessible?
| Combination | Ratio | AA | AA lg | AAA | AAA lg | UI |
|---|---|---|---|---|---|---|
| AaWhite text on this color | 8.59:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
| AaBlack text on this color | 2.44:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
| AaThis color as text on white | 8.59:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
| AaThis color as text on black | 2.44:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
WCAG 2.1: AA normal ≥ 4.5:1, AA large text ≥ 3:1, AAA normal ≥ 7:1, AAA large ≥ 4.5:1, UI components ≥ 3:1.
How does blue look with color blindness?
Simulated appearance for common types of color vision deficiency. Actual perception varies by individual.
What colors go with blue
Charcoal turns blue from purely energetic into something more adult and controlled by adding depth without another hue fight.
Gold warms blue enough to keep the palette from feeling chilly or overly technical, while still reading intentional rather than decorative-for-its-own-sake.
Cream lets blue stay expressive without turning the whole composition stark; the result feels closer to editorial or packaging work than to raw UI default.
What colors clash with blue
Neon Green beside blue tends to vibrate on bright displays, so the pair reads more like a HUD effect than a considered brand palette.
Magenta pushes blue toward a nightclub or cosmetic register that is hard to square with calmer editorial or product work.
How should I use blue in design?
- •For marketing sites, treat #0000FF as a wireframe blue unless you deliberately want a retro early-web aesthetic — shift hue slightly toward indigo or azure for branded primary buttons.
- •In presentation templates, use #0000FF for one keynote chart series only if your deck must align with legacy palettes — otherwise soften with a few percent gray to reduce projector banding.
- •When layering #0000FF on near-black backgrounds, add a thin lighter-blue inner stroke or glow so edges remain visible on OLED panels that crush deep blues.
What are good blue palettes?
Design with blue in Moda
Create a presentation or document using blue as your accent color. Moda's AI applies your color palette automatically.
Create a design with blue →What are the shades and tints of blue?
Shades (darker)
Tints (lighter)
Tones (desaturated)
Hue variations
What are the color harmonies for blue?
Harmonies are calculated from the base swatch. When a harmony matches a named color page, it links there; otherwise it appears here as a computed reference swatch.
Similar colors
Navy Blue
Navy Blue tracks close to blue in hue, but the value shift changes where each one earns its place: navy blue is easier to use for headlines, anchors, and darker sections, while blue holds onto lighter surfaces and more open applications.
Sapphire
Sapphire keeps roughly the same visual weight as blue but changes the undertone story, which is often enough to move a palette from warmer and tactile to cooler and more technical, or the reverse.
Royal Blue
Royal Blue stays very close to blue in hue, but it lands lighter, which makes it better for backgrounds, tints, and softer supporting areas than for accents, stronger hierarchy, and firmer structure.
Iris
Iris stays very close to blue in hue, but it lands lighter, which makes it better for backgrounds, tints, and softer supporting areas than for accents, stronger hierarchy, and firmer structure.
Cobalt
Cobalt is close enough to blue to keep the palette cohesive, yet the lighter-darker shift still decides whether the family behaves more like atmosphere or more like structure.
Frequently asked questions
What is the hex code for blue?
The hex code for blue is #0000FF. In RGB, that's 0 red, 0 green, and 255 blue. The approximate CMYK equivalent is 100% cyan, 100% magenta, 0% yellow, and 0% key (black).
Is blue a warm or cool color?
Blue falls on the cool side of the palette, so warm companions create the clearest contrast while other cool tones keep the system more restrained.
Should blue lead the palette or stay in supporting roles?
Blue has enough chroma to take the lead, but it usually performs best when the surrounding system stays quieter. Treat it as the voice of emphasis, not the answer to every layout need.
Where does blue work best in a layout?
Blue carries a lot of chroma, so it is usually strongest as punctuation rather than wallpaper. Use it for focal accents and let low-saturation surfaces do the balancing.
Is blue accessible?
Blue is strong enough for white text at 8.59:1 contrast, so it can handle dark panels, tags, and section headers without much trouble. As text on white, though, it is usually better reserved for larger headings or short accents than for long paragraphs.
More blue colors
Keep exploring color resources
All color pages
Browse the full library of color references, pairings, and palettes.
Blue colors
Compare blue with other blue tones.
Green colors
Explore nearby color families to build stronger palettes and contrasts.
Neutral colors
Explore nearby color families to build stronger palettes and contrasts.
Purple colors
Explore nearby color families to build stronger palettes and contrasts.
Last updated April 6, 2026
Color values are computed from the listed hex code using standard conversion formulas. RGB, HSL, and HSV are exact screen-ready conversions. CMYK is an approximate on-screen reference, not a press-ready print specification. Pairings, palettes, and use-case guidance are heuristic recommendations derived from color relationships, contrast behavior, and common presentation, document, and UI patterns.