色名 · #FF0D00
Fire Hydrant
Fire Hydrantは#FF0D00：rgb(255 13 0)、hsl(3 100% 50%)、oklch(0.63 0.255 29.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Fire Hydrant color name →
#FF0D00
oklch(0.63 0.255 29.6)
カラー変換
- HEX
- #ff0d00
- RGB
- rgb(255 13 0)
- HSL
- hsl(3 100% 50%)
- HWB
- hwb(3 0% 0%)
- OKLCH
- oklch(0.63 0.255 29.6)
- OKLab
- oklab(0.63 0.222 0.126)
- CIE Lab
- lab(54.59 79.96 69.94)
- LCH
- lch(54.59 106.23 41.2)
- CMYK
- cmyk(0% 95% 100% 0%)
ティント · シェード · トーン
ティント
- FF4332
- FF604D
- FF7865
- FF8E7B
- FFA291
- FFB5A7
- FFC8BD
- FFDBD3
- FFEDE9
シェード
- DE0A00
- BE0700
- 9E0500
- 800300
- 630200
- 480100
- 2E0000
- 160000
- 030000
トーン
- F43222
- E94433
- DD5140
- D25B4C
- C66456
- B96B5F
- AC7168
- 9E7770
- 907C78
カラーハーモニー
補色 +180°
- FF0D00
Fire Hydrant
- 009BAD
≈ Aquarium Diver
類似色 -30° +30°
- FF0D00
Fire Hydrant
- F60184
≈ Flickr Pink
- C96F00
≈ Sludge
トライアド +120° +240°
- FF0D00
Fire Hydrant
- 00A54A
≈ Green Pigment
- 5C7CFF
≈ C64 NTSC
スプリットコンプリメンタリー +150° +210°
- FF0D00
Fire Hydrant
- 009F8B
≈ Flamboyant Teal
- 0092D6
≈ Kahu Blue
テトラード +90° +180° +270°
- FF0D00
Fire Hydrant
- 7F9500
≈ Mossy Woods
- 009BAD
≈ Aquarium Diver
- A159FF
≈ Vega Violet
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.95:1 · APCA Lc 64
Ag
AA黒の上
WCAG 5.30:1 · APCA Lc 38
最適な文字色: #000000
WCAG 5.30:1 (AA) · APCA Lc 38
Contrast pairs
コードスニペット
CSS
:root {
--fire-hydrant: #ff0d00;
--fire-hydrant-rgb: 255 13 0;
--fire-hydrant-oklch: oklch(0.63 0.255 29.6);
}
.element {
color: var(--fire-hydrant);
background-color: hsl(3 100% 50%);
border-color: oklch(0.63 0.255 29.6);
}Tailwind CSS v4
@theme {
--color-fire-hydrant: #ff0d00;
--color-fire-hydrant-50: #ffdac8;
--color-fire-hydrant-100: #ffc8b3;
--color-fire-hydrant-200: #ffa88e;
--color-fire-hydrant-300: #ff7b5f;
--color-fire-hydrant-400: #ff4734;
--color-fire-hydrant-500: #ff0000;
--color-fire-hydrant-600: #dc0000;
--color-fire-hydrant-700: #b10000;
--color-fire-hydrant-800: #850000;
--color-fire-hydrant-900: #5e0001;
--color-fire-hydrant-950: #400000;
}SCSS
$fire-hydrant: #ff0d00;
$fire-hydrant-rgb: 255, 13, 0;
$fire-hydrant-light: mix(#fff, $fire-hydrant, 20%);
$fire-hydrant-dark: mix(#000, $fire-hydrant, 20%);
.element {
color: $fire-hydrant;
box-shadow: 0 0 0 2px rgba($fire-hydrant, 0.35);
}