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
首页/颜色/#28A7CB

最接近的命名颜色 · #28A7CB

#28A7CB

最接近的命名颜色: Laguna

#28A7CB(rgb(40 167 203)、hsl(193 67% 48%)、oklch(0.678 0.116 222.3))最接近命名颜色 Laguna。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。

What does Cyan mean? →

#28A7CB

oklch(0.678 0.116 222.3)

颜色转换

HEX
#28a7cb
RGB
rgb(40 167 203)
HSL
hsl(193 67% 48%)
HWB
hwb(193 16% 20%)
OKLCH
oklch(0.678 0.116 222.3)
OKLab
oklab(0.678 -0.086 -0.078)
CIE Lab
lab(63.17 -25.22 -28.61)
LCH
lch(63.17 38.14 228.6)
CMYK
cmyk(80% 18% 0% 20%)

浅色调 · 深色调 · 灰色调

浅色调

  • 4AB0D0
  • 63B9D6
  • 79C2DB
  • 8DCBE1
  • A1D3E6
  • B4DCEB
  • C7E5F0
  • DAEEF5
  • ECF6FA

深色调

  • 2191B0
  • 1B7B96
  • 15667D
  • 0F5265
  • 093E4D
  • 042C37
  • 021A22
  • 010A0F
  • 000102

灰色调

  • 3BA3C3
  • 48A0BC
  • 539CB4
  • 5C98AD
  • 6494A5
  • 6B909E
  • 718C96
  • 76888F
  • 7B8488

配色和谐

互补色 +180°

  • 28A7CB

    Laguna

  • D37E5C

    ≈ Clay Mug

类似色 -30° +30°

  • 28A7CB

    Laguna

  • 01AEAA

    ≈ Teal Me No Lies

  • 609BDD

    ≈ Blue Bay

三角配色 +120° +240°

  • 28A7CB

    Laguna

  • C97AAB

    ≈ Strawberry Freeze

  • A69A3B

    ≈ Pestulance

分裂互补色 +150° +210°

  • 28A7CB

    Laguna

  • D57884

    ≈ Juicy Details

  • C38B3D

    ≈ Golden Leaf

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

  • 28A7CB

    Laguna

  • B082CB

    ≈ Wisteria

  • D37E5C

    ≈ Clay Mug

  • 7CA759

    ≈ Grassy Meadow

对比度与无障碍

Ag

白底

WCAG 2.80:1 · APCA Lc 54

Fail
Ag

黑底

WCAG 7.48:1 · APCA Lc 48

AAA

最佳文字颜色: #000000

WCAG 7.48:1 (AAA) · APCA Lc 48

Contrast pairs

  • #28A7CB / #FFFFFF
  • #28A7CB / #000000
  • #FFFFFF / #28A7CB
  • #000000 / #28A7CB

代码片段

CSS

:root {
  --laguna: #28a7cb;
  --laguna-rgb: 40 167 203;
  --laguna-oklch: oklch(0.678 0.116 222.3);
}

.element {
  color: var(--laguna);
  background-color: hsl(193 67% 48%);
  border-color: oklch(0.678 0.116 222.3);
}

Tailwind CSS v4

@theme {
  --color-laguna: #28a7cb;
  --color-laguna-50: #d3fdff;
  --color-laguna-100: #bff1ff;
  --color-laguna-200: #9de0f9;
  --color-laguna-300: #70c4e4;
  --color-laguna-400: #3dadd0;
  --color-laguna-500: #0096bd;
  --color-laguna-600: #007fa0;
  --color-laguna-700: #006680;
  --color-laguna-800: #004b5e;
  --color-laguna-900: #003442;
  --color-laguna-950: #001f2a;
}

SCSS

$laguna: #28a7cb;
$laguna-rgb: 40, 167, 203;
$laguna-light: mix(#fff, $laguna, 20%);
$laguna-dark: mix(#000, $laguna, 20%);

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

相近的命名颜色

  • 28A8CD

    Reboot

  • 36A5C9

    Laguna

  • 1CA9C9

    Pacific Blue

  • 28A4CB

    Sardinia Beaches

  • 24A4C8

    Celestine Spring

  • 06A9CA

    Gummy Dolphins

  • 21ABCD

    Ball Blue

  • 31A6D1

    Modal

  • 38A3CC

    Skydome

  • 24A6C2

    True Sky Blue

  • 16A3CB

    Charybdis

  • 1DACD1

    Hú Lán Blue

Palettes with similar colors

  • Classic Gummy Dolphins SignalBlue · Cold
  • True Corfu Waters MeadowBlue · Cold
  • Luminous Caribbean Blue GroveBlue · Cold
  • Cloisonné MeadowViolet · Cold
  • Blue Chip VaultViolet · Cold
  • Pure Gummy Dolphins GlacierBlue · 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