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
首页/颜色/#227CA7

最接近的命名颜色 · #227CA7

#227CA7

最接近的命名颜色: Neptune

#227CA7(rgb(34 124 167)、hsl(199 66% 39%)、oklch(0.555 0.105 234.6))最接近命名颜色 Neptune。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。

What does Blue mean? →

#227CA7

oklch(0.555 0.105 234.6)

颜色转换

HEX
#227ca7
RGB
rgb(34 124 167)
HSL
hsl(199 66% 39%)
HWB
hwb(199 13% 35%)
OKLCH
oklch(0.555 0.105 234.6)
OKLab
oklab(0.555 -0.061 -0.085)
CIE Lab
lab(48.45 -15.06 -30.95)
LCH
lch(48.45 34.42 244.1)
CMYK
cmyk(80% 26% 0% 35%)

浅色调 · 深色调 · 灰色调

浅色调

  • 3F89B0
  • 5796B9
  • 6DA3C2
  • 82B0CB
  • 97BDD4
  • ABCADC
  • C0D7E5
  • D5E4EE
  • EAF2F6

深色调

  • 1C6B91
  • 165A7B
  • 114A66
  • 0B3B52
  • 072C3E
  • 031E2C
  • 01111A
  • 00050A
  • 000101

灰色调

  • 327DA3
  • 3E7DA0
  • 497E9C
  • 527F98
  • 5B7F94
  • 637F90
  • 6B808C
  • 728088
  • 798084

配色和谐

互补色 +180°

  • 227CA7

    Neptune

  • A26131

    ≈ Scarecrow Frown

类似色 -30° +30°

  • 227CA7

    Neptune

  • 00838D

    ≈ Precious Blue

  • 5471B0

    ≈ Prefect

三角配色 +120° +240°

  • 227CA7

    Neptune

  • A25776

    ≈ Ruby Shade

  • 727A28

    ≈ Ripe Green

分裂互补色 +150° +210°

  • 227CA7

    Neptune

  • A85854

    ≈ Cheek Red

  • 8F6D19

    ≈ Sassy Olive

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

  • 227CA7

    Neptune

  • 915C95

    ≈ Aster Violetta

  • A26131

    ≈ Scarecrow Frown

  • 49834B

    ≈ Tarmac Green

对比度与无障碍

Ag

白底

WCAG 4.65:1 · APCA Lc 72

AA
Ag

黑底

WCAG 4.50:1 · APCA Lc 30

AA

最佳文字颜色: #FFFFFF

WCAG 4.65:1 (AA) · APCA Lc 72

Contrast pairs

  • #227CA7 / #FFFFFF
  • #227CA7 / #000000
  • #FFFFFF / #227CA7
  • #000000 / #227CA7

代码片段

CSS

:root {
  --neptune: #227ca7;
  --neptune-rgb: 34 124 167;
  --neptune-oklch: oklch(0.555 0.105 234.6);
}

.element {
  color: var(--neptune);
  background-color: hsl(199 66% 39%);
  border-color: oklch(0.555 0.105 234.6);
}

Tailwind CSS v4

@theme {
  --color-neptune: #227ca7;
  --color-neptune-50: #dafbff;
  --color-neptune-100: #c8eeff;
  --color-neptune-200: #aadcfc;
  --color-neptune-300: #82c0e6;
  --color-neptune-400: #5aa8d3;
  --color-neptune-500: #2c90c1;
  --color-neptune-600: #287aa3;
  --color-neptune-700: #206283;
  --color-neptune-800: #134860;
  --color-neptune-900: #0c3244;
  --color-neptune-950: #001e2c;
}

SCSS

$neptune: #227ca7;
$neptune-rgb: 34, 124, 167;
$neptune-light: mix(#fff, $neptune, 20%);
$neptune-dark: mix(#000, $neptune, 20%);

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

相近的命名颜色

  • 2B7DA6

    Prominent Blue

  • 237FAC

    Blue Bird Day

  • 1E7EAE

    Blue Vacation

  • 007BA7

    Celadon Blue

  • 007DAC

    Neptune

  • 007BAA

    Benitoite

  • 007CAC

    Jacuzzi

  • 2178A4

    In the Mood

  • 017AA6

    Quiet Cove

  • 0180AB

    Oh so Vo

  • 007AA5

    CG Blue

  • 007FAE

    Turkish Blue

Palettes with similar colors

  • Steady Neptune RibbonViolet · Cold
  • Neptune BeaconViolet · Cold
  • Steady Jacuzzi HarborTrending · Violet
  • Steady Neptune StudioViolet · Cold
  • Jacuzzi BriefViolet · Cold
  • Classic Jacuzzi CascadeViolet · Cold

在工具中打开

取色器配色组合对比度检测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