色名 · #DEDEDE

Kingly Cloud

Kingly Cloudは#DEDEDE：rgb(222 222 222)、hsl(0 0% 87%)、oklch(0.901 0 0)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Gray mean? → · Kingly Cloud color name →

#DEDEDE

oklch(0.901 0 0)

カラー変換

HEX: #dedede
RGB: rgb(222 222 222)
HSL: hsl(0 0% 87%)
HWB: hwb(0 87% 13%)
OKLCH: oklch(0.901 0 0)
OKLab: oklab(0.901 0 0)
CIE Lab: lab(88.47 0 0)
LCH: lch(88.47 0 0)
CMYK: cmyk(0% 0% 0% 13%)

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

ティント

E1E1E1
E5E5E5
E8E8E8
EBEBEB
EEEEEE
F2F2F2
F5F5F5
F8F8F8
FCFCFC

シェード

C1C1C1
A5A5A5
898989
6F6F6F
555555
3D3D3D
262626
121212
020202

トーン

D4D4D4
CACACA
C1C1C1
B7B7B7
AEAEAE
A4A4A4
9B9B9B
929292
898989

カラーハーモニー

補色 +180°

DEDEDE
Kingly Cloud
DEDEDE
≈ Kingly Cloud

類似色 -30° +30°

トライアド +120° +240°

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

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

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

白の上

WCAG 1.34:1 · APCA Lc 17

Fail

黒の上

WCAG 15.60:1 · APCA Lc 87

AAA

最適な文字色: #000000

WCAG 15.60:1 (AAA) · APCA Lc 87

Contrast pairs

コードスニペット

CSS

:root {
  --kingly-cloud: #dedede;
  --kingly-cloud-rgb: 222 222 222;
  --kingly-cloud-oklch: oklch(0.901 0 0);
}

.element {
  color: var(--kingly-cloud);
  background-color: hsl(0 0% 87%);
  border-color: oklch(0.901 0 0);
}

Tailwind CSS v4

@theme {
  --color-kingly-cloud: #dedede;
  --color-kingly-cloud-50: #f5f5f5;
  --color-kingly-cloud-100: #e8e8e8;
  --color-kingly-cloud-200: #d4d4d4;
  --color-kingly-cloud-300: #b7b7b7;
  --color-kingly-cloud-400: #9e9e9e;
  --color-kingly-cloud-500: #868686;
  --color-kingly-cloud-600: #717171;
  --color-kingly-cloud-700: #5b5b5b;
  --color-kingly-cloud-800: #424242;
  --color-kingly-cloud-900: #2e2e2e;
  --color-kingly-cloud-950: #1b1b1b;
}

SCSS

$kingly-cloud: #dedede;
$kingly-cloud-rgb: 222, 222, 222;
$kingly-cloud-light: mix(#fff, $kingly-cloud, 20%);
$kingly-cloud-dark: mix(#000, $kingly-cloud, 20%);

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

近い色名

Palettes with this color

Palettes with similar colors

ツールで開く

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