Skip to content

#697fdb

a balanced, vivid blue · warm · closest name: dodgerblue

RGB
105, 127, 219
HSL
228°, 61%, 64%
CMYK
52, 42, 0, 14
Luminance
0.2330

Every format

HEX#697fdb
RGBrgb(105, 127, 219)
HSLhsl(228, 61%, 64%)
CMYKcmyk(52%, 42%, 0%, 14%)
LABlab(55.4 17.7 -49.6)
LCHlch(55.4 52.7 289.7)
OKLCHoklch(0.622 0.141 271.6)

Copy-ready code

/* CSS */
color: #697fdb;
background-color: #697fdb;
/* Tailwind (arbitrary) */
class="text-[#697fdb] bg-[#697fdb]"
/* SCSS */
$brand: #697fdb;
/* SwiftUI */
Color(red: 0.412, green: 0.498, blue: 0.859)
/* Android */
Color.parseColor("#697fdb")

Accessibility — WCAG contrast

Aa
#697fdb on white: 3.71:1
AA ✗ fail · AA-large · AAA
Aa
#697fdb on black: 5.66:1
AA ✓ pass · AA-large · AAA
true color
protanopia
deuteranopia
tritanopia

RGB percentages

Red41.2%
Green49.8%
Blue85.9%

CMYK percentages

Cyan52.1%
Magenta42.0%
Yellow0.0%
Key (black)14.1%

Color previews

#697fdb text on a black background

contrast 5.66:1

Card sample

#697fdb text on a white background

contrast 3.71:1

Card sample

CSS3 live lab

Text font color

The quick brown fox

color: #697fdb;
Background color
Panel with #697fdb background
background-color: #697fdb;
Text shadow — hex

Glowing headline

text-shadow: 2px 2px 8px #697fdb;
Text shadow — RGB

Soft neon halo

text-shadow: 0 0 14px rgba(105, 127, 219, 0.45);
Div box shadow
Elevated card
box-shadow: 0 12px 32px -8px rgba(105, 127, 219, 0.45);
Border & gradient
Gradient panel
border: 3px solid #697fdb;
background: linear-gradient(135deg, #697fdb, #9F69DB);

Monochromatic scale

Palettes built from #697fdb

Shades — darker

Tints — lighter

Hue & tone neighbors

Color harmonies

Nearest named colors

Work with #697fdb in the Color Lab