色名 · #BDCBCB

Ice Flow

Ice Flowは#BDCBCB：rgb(189 203 203)、hsl(180 12% 77%)、oklch(0.831 0.015 196.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Gray mean? → · Ice Flow color name →

#BDCBCB

oklch(0.831 0.015 196.9)

カラー変換

HEX: #bdcbcb
RGB: rgb(189 203 203)
HSL: hsl(180 12% 77%)
HWB: hwb(180 74% 20%)
OKLCH: oklch(0.831 0.015 196.9)
OKLab: oklab(0.831 -0.015 -0.004)
CIE Lab: lab(80.6 -4.93 -1.73)
LCH: lch(80.6 5.23 199.3)
CMYK: cmyk(7% 0% 0% 20%)

ティント · シェード · トーン

ティント

C3D0D0
CAD5D5
D0DADA
D7E0E0
DEE5E5
E4EAEA
EBEFEF
F2F4F4
F8FAFA

シェード

A4B0B0
8C9696
747D7D
5D6565
474D4D
333737
1F2222
0D0F0F
020202

トーン

B7C3C3
B1BCBC
AAB4B4
A4ACAC
9EA5A5
989D9D
929696
8C8E8E
868787

カラーハーモニー

補色 +180°

BDCBCB
Ice Flow
D2C4C4
≈ Vaguely Mauve

類似色 -30° +30°

トライアド +120° +240°

スプリットコンプリメンタリー +150° +210°

テトラード +90° +180° +270°

コントラストとアクセシビリティ

白の上

WCAG 1.67:1 · APCA Lc 29

Fail

黒の上

WCAG 12.56:1 · APCA Lc 73

AAA

最適な文字色: #000000

WCAG 12.56:1 (AAA) · APCA Lc 73

Contrast pairs

コードスニペット

CSS

:root {
  --ice-flow: #bdcbcb;
  --ice-flow-rgb: 189 203 203;
  --ice-flow-oklch: oklch(0.831 0.015 196.9);
}

.element {
  color: var(--ice-flow);
  background-color: hsl(180 12% 77%);
  border-color: oklch(0.831 0.015 196.9);
}

Tailwind CSS v4

@theme {
  --color-ice-flow: #bdcbcb;
  --color-ice-flow-50: #f0f6f7;
  --color-ice-flow-100: #e2e9ea;
  --color-ice-flow-200: #cdd6d7;
  --color-ice-flow-300: #afbaba;
  --color-ice-flow-400: #95a1a1;
  --color-ice-flow-500: #7b898a;
  --color-ice-flow-600: #687474;
  --color-ice-flow-700: #535d5d;
  --color-ice-flow-800: #3d4444;
  --color-ice-flow-900: #2a2f2f;
  --color-ice-flow-950: #171c1b;
}

SCSS

$ice-flow: #bdcbcb;
$ice-flow-rgb: 189, 203, 203;
$ice-flow-light: mix(#fff, $ice-flow, 20%);
$ice-flow-dark: mix(#000, $ice-flow, 20%);

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

近い色名

Palettes with similar colors

ツールで開く

ピッカーペアコントラストチェッカー Studio JSON API