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
首页/颜色/#297DA2

最接近的命名颜色 · #297DA2

#297DA2

最接近的命名颜色: Bleu Ciel

#297DA2(rgb(41 125 162)、hsl(198 60% 40%)、oklch(0.557 0.097 231.5))最接近命名颜色 Bleu Ciel。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。

What does Blue mean? →

#297DA2

oklch(0.557 0.097 231.5)

颜色转换

HEX
#297da2
RGB
rgb(41 125 162)
HSL
hsl(198 60% 40%)
HWB
hwb(198 16% 36%)
OKLCH
oklch(0.557 0.097 231.5)
OKLab
oklab(0.557 -0.06 -0.076)
CIE Lab
lab(48.74 -16.05 -27.58)
LCH
lch(48.74 31.91 239.8)
CMYK
cmyk(75% 23% 0% 36%)

浅色调 · 深色调 · 灰色调

浅色调

  • 438AAB
  • 5A96B5
  • 6FA3BE
  • 84B0C7
  • 98BDD1
  • ADCADA
  • C1D7E3
  • D6E4ED
  • EAF2F6

深色调

  • 226C8C
  • 1C5B77
  • 154B63
  • 0F3B4F
  • 092C3C
  • 051E2A
  • 021119
  • 01050A
  • 000101

灰色调

  • 377E9F
  • 427E9C
  • 4B7F98
  • 547F95
  • 5C7F92
  • 64808E
  • 6C808B
  • 738087
  • 798084

配色和谐

互补色 +180°

  • 297DA2

    Bleu Ciel

  • A0623B

    ≈ Wet Adobe

类似色 -30° +30°

  • 297DA2

    Bleu Ciel

  • 00848B

    ≈ Tucson Teal

  • 5373AC

    ≈ Plunder

三角配色 +120° +240°

  • 297DA2

    Bleu Ciel

  • 9E5B7A

    ≈ Rose Wine

  • 75792F

    ≈ Ripe Green

分裂互补色 +150° +210°

  • 297DA2

    Bleu Ciel

  • A55B5A

    ≈ Cheek Red

  • 906D27

    ≈ Sassy Olive

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

  • 297DA2

    Bleu Ciel

  • 8E6096

    ≈ Aster Violetta

  • A0623B

    ≈ Wet Adobe

  • 52824B

    ≈ Rambling Green

对比度与无障碍

Ag

白底

WCAG 4.61:1 · APCA Lc 72

AA
Ag

黑底

WCAG 4.54:1 · APCA Lc 30

AA

最佳文字颜色: #FFFFFF

WCAG 4.61:1 (AA) · APCA Lc 72

Contrast pairs

  • #297DA2 / #FFFFFF
  • #297DA2 / #000000
  • #FFFFFF / #297DA2
  • #000000 / #297DA2

代码片段

CSS

:root {
  --bleu-ciel: #297da2;
  --bleu-ciel-rgb: 41 125 162;
  --bleu-ciel-oklch: oklch(0.557 0.097 231.5);
}

.element {
  color: var(--bleu-ciel);
  background-color: hsl(198 60% 40%);
  border-color: oklch(0.557 0.097 231.5);
}

Tailwind CSS v4

@theme {
  --color-bleu-ciel: #297da2;
  --color-bleu-ciel-50: #dbfbff;
  --color-bleu-ciel-100: #c9eeff;
  --color-bleu-ciel-200: #acdcf8;
  --color-bleu-ciel-300: #85c0e1;
  --color-bleu-ciel-400: #5ea9ce;
  --color-bleu-ciel-500: #3391bb;
  --color-bleu-ciel-600: #2d7b9e;
  --color-bleu-ciel-700: #24627f;
  --color-bleu-ciel-800: #16485d;
  --color-bleu-ciel-900: #0e3241;
  --color-bleu-ciel-950: #021e2a;
}

SCSS

$bleu-ciel: #297da2;
$bleu-ciel-rgb: 41, 125, 162;
$bleu-ciel-light: mix(#fff, $bleu-ciel, 20%);
$bleu-ciel-dark: mix(#000, $bleu-ciel, 20%);

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

相近的命名颜色

  • 2B7DA6

    Prominent Blue

  • 1880A1

    Summer Blue

  • 007FA2

    Kingfisher Sheen

  • 37799C

    Peninsula

  • 3A7A9B

    Blue Dart Frog

  • 2282A8

    Blue Paisley

  • 007E9F

    Turkish Tile

  • 237FAC

    Blue Bird Day

  • 33789C

    Fun and Games

  • 0081A8

    Advertising Blue

  • 007BA1

    Bleu Ciel

  • 017F9E

    Deep Universe

Palettes with similar colors

  • Pure Bleu Ciel MeadowViolet · Cold
  • Neptune TideTrending · Violet
  • Bleu Ciel BriefBlue · Cold
  • Classic Bleu Ciel BeaconBlue · Cold
  • Steady Bleu Ciel MeadowViolet · Cold
  • Steady Neptune StudioViolet · 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