色名 · #FA0103
Minesweeper’s Red
Minesweeper’s Redは#FA0103：rgb(250 1 3)、hsl(360 99% 49%)、oklch(0.619 0.254 29.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Minesweeper’s Red color name →
#FA0103
oklch(0.619 0.254 29.1)
カラー変換
- HEX
- #fa0103
- RGB
- rgb(250 1 3)
- HSL
- hsl(360 99% 49%)
- HWB
- hwb(360 0% 2%)
- OKLCH
- oklch(0.619 0.254 29.1)
- OKLab
- oklab(0.619 0.222 0.123)
- CIE Lab
- lab(53.27 79.55 68.05)
- LCH
- lch(53.27 104.69 40.5)
- CMYK
- cmyk(0% 100% 99% 2%)
ティント · シェード · トーン
ティント
- FE4032
- FF5D4D
- FF7664
- FF8C7B
- FFA091
- FFB4A7
- FFC7BD
- FFDAD3
- FFEDE9
シェード
- D90102
- BA0102
- 9B0001
- 7D0001
- 610000
- 460000
- 2D0000
- 150000
- 030000
トーン
- F02E23
- E54133
- DA4F40
- CF594B
- C36255
- B76A5F
- AB7067
- 9E7670
- 8F7B78
カラーハーモニー
補色 +180°
- FA0103
Minesweeper’s Red
- 0097A8
≈ Aquarium Diver
類似色 -30° +30°
- FA0103
Minesweeper’s Red
- F00082
≈ Fabulous Fuchsia
- C46C00
≈ Sludge
トライアド +120° +240°
- FA0103
Minesweeper’s Red
- 00A145
≈ Link Green
- 5577FF
≈ C64 NTSC
スプリットコンプリメンタリー +150° +210°
- FA0103
Minesweeper’s Red
- 009C87
≈ Flamboyant Teal
- 008FD0
≈ Rich Electric Blue
テトラード +90° +180° +270°
- FA0103
Minesweeper’s Red
- 7D9100
≈ Foggy Bog
- 0097A8
≈ Aquarium Diver
- 9E53FF
≈ Irrigo Purple
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 4.14:1 · APCA Lc 65
Ag
AA黒の上
WCAG 5.07:1 · APCA Lc 36
最適な文字色: #000000
WCAG 5.07:1 (AA) · APCA Lc 36
Contrast pairs
コードスニペット
CSS
:root {
--minesweeper-s-red: #fa0103;
--minesweeper-s-red-rgb: 250 1 3;
--minesweeper-s-red-oklch: oklch(0.619 0.254 29.1);
}
.element {
color: var(--minesweeper-s-red);
background-color: hsl(360 99% 49%);
border-color: oklch(0.619 0.254 29.1);
}Tailwind CSS v4
@theme {
--color-minesweeper-s-red: #fa0103;
--color-minesweeper-s-red-50: #ffdac9;
--color-minesweeper-s-red-100: #ffc8b4;
--color-minesweeper-s-red-200: #ffa890;
--color-minesweeper-s-red-300: #ff7b61;
--color-minesweeper-s-red-400: #ff4838;
--color-minesweeper-s-red-500: #ff0000;
--color-minesweeper-s-red-600: #db0000;
--color-minesweeper-s-red-700: #b10000;
--color-minesweeper-s-red-800: #850001;
--color-minesweeper-s-red-900: #5e0002;
--color-minesweeper-s-red-950: #400000;
}SCSS
$minesweeper-s-red: #fa0103;
$minesweeper-s-red-rgb: 250, 1, 3;
$minesweeper-s-red-light: mix(#fff, $minesweeper-s-red, 20%);
$minesweeper-s-red-dark: mix(#000, $minesweeper-s-red, 20%);
.element {
color: $minesweeper-s-red;
box-shadow: 0 0 0 2px rgba($minesweeper-s-red, 0.35);
}