Colorise ProOKLCH Engine
ExploreStudioNamesPickerPairs
ExploreStudioNamesPickerPairsContrastExtract
Menu

Product

  • Home
  • Explore
  • Studio
  • Color Names

Tools

  • Picker
  • Color Pairs
  • Contrast
  • Image Extract
  • Gradient Lab
  • Palette Diff
  • Brand from URL

Guides

  • All guides
  • OKLCH vs HSL
  • WCAG vs APCA
  • OKLCH color scales
  • Gamut & sRGB
  • Extract from images
  • HEX to OKLCH
  • Dark mode colors
  • Color meanings
首页/颜色/#3D6EA6

最接近的命名颜色 · #3D6EA6

#3D6EA6

最接近的命名颜色: Naval

#3D6EA6(rgb(61 110 166)、hsl(212 46% 45%)、oklch(0.53 0.104 253.1))最接近命名颜色 Naval。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。

What does Blue mean? →

#3D6EA6

oklch(0.53 0.104 253.1)

颜色转换

HEX
#3d6ea6
RGB
rgb(61 110 166)
HSL
hsl(212 46% 45%)
HWB
hwb(212 24% 35%)
OKLCH
oklch(0.53 0.104 253.1)
OKLab
oklab(0.53 -0.03 -0.099)
CIE Lab
lab(44.98 -3.25 -35.69)
LCH
lch(44.98 35.84 264.8)
CMYK
cmyk(63% 34% 0% 35%)

浅色调 · 深色调 · 灰色调

浅色调

  • 507CAF
  • 638AB8
  • 7698C2
  • 89A7CB
  • 9CB5D4
  • AFC4DC
  • C3D2E5
  • D7E1EE
  • EBF0F6

深色调

  • 345F90
  • 2B507A
  • 224165
  • 1A3351
  • 12263E
  • 0A192B
  • 040E1A
  • 01040A
  • 000101

灰色调

  • 4570A3
  • 4C729F
  • 53749B
  • 5A7698
  • 607894
  • 677A90
  • 6D7B8C
  • 747D88
  • 7A7F84

配色和谐

互补色 +180°

  • 3D6EA6

    Naval

  • 906117

    ≈ Tapenade

类似色 -30° +30°

  • 3D6EA6

    Naval

  • 007795

    ≈ Celestial

  • 6463A6

    ≈ Blue Iris

三角配色 +120° +240°

  • 3D6EA6

    Naval

  • 9E505A

    ≈ Cranberry Jam

  • 537836

    ≈ Luck of the Irish

分裂互补色 +150° +210°

  • 3D6EA6

    Naval

  • 9D5638

    ≈ Cinnamon Sparkle

  • 776E15

    ≈ Olivetone

四角配色 +90° +180° +270°

  • 3D6EA6

    Naval

  • 94527B

    ≈ Verve Violet

  • 906117

    ≈ Tapenade

  • 1F7E5A

    ≈ Spanish Viridian

对比度与无障碍

Ag

白底

WCAG 5.27:1 · APCA Lc 76

AA
Ag

黑底

WCAG 3.97:1 · APCA Lc 26

Fail

最佳文字颜色: #FFFFFF

WCAG 5.27:1 (AA) · APCA Lc 76

Contrast pairs

  • #3D6EA6 / #FFFFFF
  • #3D6EA6 / #000000
  • #FFFFFF / #3D6EA6
  • #000000 / #3D6EA6

代码片段

CSS

:root {
  --naval: #3d6ea6;
  --naval-rgb: 61 110 166;
  --naval-oklch: oklch(0.53 0.104 253.1);
}

.element {
  color: var(--naval);
  background-color: hsl(212 46% 45%);
  border-color: oklch(0.53 0.104 253.1);
}

Tailwind CSS v4

@theme {
  --color-naval: #3d6ea6;
  --color-naval-50: #e2f7ff;
  --color-naval-100: #d1eaff;
  --color-naval-200: #b7d7ff;
  --color-naval-300: #94baec;
  --color-naval-400: #72a2da;
  --color-naval-500: #5189c9;
  --color-naval-600: #4674aa;
  --color-naval-700: #375d88;
  --color-naval-800: #254465;
  --color-naval-900: #192f47;
  --color-naval-950: #091c2e;
}

SCSS

$naval: #3d6ea6;
$naval-rgb: 61, 110, 166;
$naval-light: mix(#fff, $naval, 20%);
$naval-dark: mix(#000, $naval, 20%);

.element {
  color: $naval;
  box-shadow: 0 0 0 2px rgba($naval, 0.35);
}

相近的命名颜色

  • 366FA6

    Mega Blue

  • 356FAD

    Nocturne Shade

  • 3C73A8

    Flat Blue

  • 316EA0

    Lochmara

  • 416FAF

    Wide Sky

  • 3B719F

    Muted Blue

  • 436BAD

    Waterline Blue

  • 2B6DAA

    In the Nick

  • 3C6A9D

    Star Sapphire

  • 496EAD

    New Age Blue

  • 2A6FA1

    Deep Water

  • 35709D

    Vallarta Blue

Palettes with similar colors

  • Queen Blue GardenViolet · Gray
  • Steady Song of the Sea VaultViolet · Cold
  • True Matt Blue GardenViolet · Cold
  • True Campanula SystemViolet · Cold
  • Steady Matt Blue SystemViolet · Cold
  • True Song of the Sea CascadeViolet · Gray

在工具中打开

取色器配色组合对比度检测StudioJSON API
Colorise Pro

Free OKLCH color workspace: precision color picker, color pairs, WCAG & APCA contrast checker, palette from image, Studio systems, names, gradients, and brand tools. Export HEX, CSS, Tailwind & DTCG.

OKLCH Engine

Product

  • Home
  • Explore
  • Studio
  • Color Names
  • Color Codes

Tools

  • Color Picker
  • Color Pairs
  • Contrast Checker
  • Image Extract
  • Gradient Lab
  • Palette Diff
  • Brand from URL
  • For presentations
  • For business cards
  • For SaaS landings
  • Duo pairs
  • Trio systems

Guides

  • All guides
  • OKLCH vs HSL
  • WCAG vs APCA
  • OKLCH color scales
  • Gamut & sRGB
  • Extract from images
  • HEX to OKLCH
  • Dark mode colors
  • Color meanings

Legal

  • Privacy
  • Terms

© 2026 Colorise Pro. All rights reserved.

© 2026 Colorise Pro. Built for precision color work.

Report infringement: [email protected] (Colorise Pro)

PrivacyTermsOKLCH · WCAG · APCA