最も近い色名 · #67A6F5
#67A6F5
最も近い色名: Fennel Flower
#67A6F5（rgb(103 166 245)、hsl(213 88% 68%)、oklch(0.716 0.133 254.8)）に最も近い色名はFennel Flowerです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#67A6F5
oklch(0.716 0.133 254.8)
カラー変換
- HEX
- #67a6f5
- RGB
- rgb(103 166 245)
- HSL
- hsl(213 88% 68%)
- HWB
- hwb(213 40% 4%)
- OKLCH
- oklch(0.716 0.133 254.8)
- OKLab
- oklab(0.716 -0.035 -0.129)
- CIE Lab
- lab(66.44 -3.26 -46.38)
- LCH
- lch(66.44 46.5 266)
- CMYK
- cmyk(58% 32% 0% 4%)
ティント · シェード · トーン
ティント
- 77AFF7
- 86B8F8
- 95C1FA
- A4CAFB
- B3D3FC
- C2DCFD
- D2E5FE
- E1EEFE
- F0F6FF
シェード
- 5990D5
- 4B7AB6
- 3D6598
- 30517B
- 233E5F
- 172B44
- 0C1A2B
- 040A15
- 000103
トーン
- 6BA3E9
- 6E9FDD
- 719BD2
- 7498C6
- 7694BA
- 7890AF
- 7B8CA3
- 7D8897
- 7E848C
カラーハーモニー
補色 +180°
- 67A6F5
Fennel Flower
- D49632
≈ Saimin Noodle Soup
類似色 -30° +30°
- 67A6F5
Fennel Flower
- 11B4E2
≈ Blue Atoll
- 9B96F3
≈ Cobalite
トライアド +120° +240°
- 67A6F5
Fennel Flower
- EA7E89
≈ Dimple
- 7EB65D
≈ Palm Tree
スプリットコンプリメンタリー +150° +210°
- 67A6F5
Fennel Flower
- E7865A
≈ Orangevale
- B0A734
≈ Earls Green
テトラード +90° +180° +270°
- 67A6F5
Fennel Flower
- DD80B7
≈ Middle Purple
- D49632
≈ Saimin Noodle Soup
- 39BD8E
≈ Aztec Jade
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.51:1 · APCA Lc 49
Ag
AAA黒の上
WCAG 8.34:1 · APCA Lc 53
最適な文字色: #000000
WCAG 8.34:1 (AAA) · APCA Lc 53
Contrast pairs
コードスニペット
CSS
:root {
--fennel-flower: #67a6f5;
--fennel-flower-rgb: 103 166 245;
--fennel-flower-oklch: oklch(0.716 0.133 254.8);
}
.element {
color: var(--fennel-flower);
background-color: hsl(213 88% 68%);
border-color: oklch(0.716 0.133 254.8);
}Tailwind CSS v4
@theme {
--color-fennel-flower: #67a6f5;
--color-fennel-flower-50: #ddf7ff;
--color-fennel-flower-100: #cceaff;
--color-fennel-flower-200: #b0d7ff;
--color-fennel-flower-300: #8bbafb;
--color-fennel-flower-400: #66a1eb;
--color-fennel-flower-500: #4287dc;
--color-fennel-flower-600: #3973ba;
--color-fennel-flower-700: #2d5c95;
--color-fennel-flower-800: #1c446f;
--color-fennel-flower-900: #122f4e;
--color-fennel-flower-950: #051b34;
}SCSS
$fennel-flower: #67a6f5;
$fennel-flower-rgb: 103, 166, 245;
$fennel-flower-light: mix(#fff, $fennel-flower, 20%);
$fennel-flower-dark: mix(#000, $fennel-flower, 20%);
.element {
color: $fennel-flower;
box-shadow: 0 0 0 2px rgba($fennel-flower, 0.35);
}