HomeColor Encyclopedia
Blue · 🗳️ XKCD

Blue

#0343DF

A medium vivid blue with cool undertones. Named by popular vote in the XKCD color survey — a crowdsourced color name used by 123+ respondents.

Generate palette with this color →

Emotion & Mood

Emotion
BalancedVibrantCool
Mood
EnergeticDynamic

Personality & Symbolism

ConfidentStrongAssertive
Recommended Use

Suitable for accent colors and attention-grabbing elements.

Color Harmonies

Complementary
#0343df
+
#dd9f03
Split Complementary
#dd3303
#0343df
#aedd03
Darker Shades
Lighter Tints

Visual Analysis

Hue223°
Saturation97%
Lightness44%
This is a medium-toned color with high saturation. It falls in the blue hue family (223°).

Technical Values

HEX#0343DF
RGBrgb(3, 67, 223)
HSLhsl(223, 97%, 44%)
CMYK99%, 70%, 0%, 13%
ContrastDark
CSSbackground: #0343df;

Accessibility — WCAG Contrast

White Text Sample
The quick brown fox jumps.
7.31:1
AA AAA
Black Text Sample
The quick brown fox jumps.
2.87:1
AA AAA

WCAG 2.1 requires a contrast ratio of ≥4.5:1 for AA (normal text) and ≥7:1 for AAA. Best text color for this background: white (#FFFFFF).

Color Psychology

Color Temperature

This cool-toned color (hue 223°) evokes feelings of calm, trust, and intellectual focus. Cool colors tend to recede visually, creating depth and spaciousness in layouts.

Visual Weight

This mid-range lightness (44%) creates a balanced visual presence — neither heavy nor ethereal. It works well for both text and interactive elements.

Saturation Impact

The high saturation (97%) creates a vibrant, attention-demanding presence. Highly saturated colors are processed faster by the human brain — reaction time decreases by approximately 50ms compared to desaturated variants.

Design Applications

Corporate & Enterprise

Communicates trust and professionalism — the top choice for corporate sites, legal firms, and B2B SaaS.

Government & Institutions

Authority and dependability — frequently used for government portals, educational institutions, and official communications.

CTAs & Accents

High saturation draws attention — use for primary buttons, notification badges, and important interactive elements.

Similar Colors

#1C212D (Hexadecimal Dark Navy Blue)
#1C212D
紺青 (Konjyo)
#113285
Indigo
#142A5B
Aegean Blue
#ADBFE7
Dark Blue-Green (Oceanic)
#0B162E
Light Blue-Grayish
#D6DCED
Navy
#01153E
#7893C9 (Hexadecimal) or Dark Cyan (Common name)
#7893C9