色名 · #655F2D
Saguaro
Saguaroは#655F2D：rgb(101 95 45)、hsl(54 38% 29%)、oklch(0.479 0.07 102.5)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Saguaro color name →
#655F2D
oklch(0.479 0.07 102.5)
カラー変換
- HEX
- #655f2d
- RGB
- rgb(101 95 45)
- HSL
- hsl(54 38% 29%)
- HWB
- hwb(54 18% 60%)
- OKLCH
- oklch(0.479 0.07 102.5)
- OKLab
- oklab(0.479 -0.015 0.069)
- CIE Lab
- lab(40.01 -2.99 29.11)
- LCH
- lch(40.01 29.27 95.9)
- CMYK
- cmyk(0% 6% 55% 60%)
ティント · シェード · トーン
ティント
- 736E42
- 817D56
- 908C6A
- 9F9C7E
- AFAC93
- BEBCA8
- CECDBD
- DEDDD3
- EEEEE9
シェード
- 575226
- 49441F
- 3C3818
- 2F2C11
- 22200B
- 171506
- 0C0A02
- 030301
- 000000
トーン
- 686236
- 6A663F
- 6D6948
- 6F6C50
- 727058
- 757360
- 787668
- 7A7A70
- 7D7D78
カラーハーモニー
補色 +180°
- 655F2D
Saguaro
- 575884
≈ Mauve Dusk
類似色 -30° +30°
- 655F2D
Saguaro
- 76572E
≈ Arable Brown
- 4E663C
≈ Mountain Forest
トライアド +120° +240°
- 655F2D
Saguaro
- 28667A
≈ San Gabriel Blue
- 794D68
≈ Brocade Violet
スプリットコンプリメンタリー +150° +210°
- 655F2D
Saguaro
- 406084
≈ Functional Blue
- 6B527A
≈ Gladiola Violet
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 6.50:1 · APCA Lc 82
Ag
Fail黒の上
WCAG 3.22:1 · APCA Lc 20
最適な文字色: #FFFFFF
WCAG 6.50:1 (AA) · APCA Lc 82
Contrast pairs
コードスニペット
CSS
:root {
--saguaro: #655f2d;
--saguaro-rgb: 101 95 45;
--saguaro-oklch: oklch(0.479 0.07 102.5);
}
.element {
color: var(--saguaro);
background-color: hsl(54 38% 29%);
border-color: oklch(0.479 0.07 102.5);
}Tailwind CSS v4
@theme {
--color-saguaro: #655f2d;
--color-saguaro-50: #f8f7e0;
--color-saguaro-100: #ebeacf;
--color-saguaro-200: #d8d6b4;
--color-saguaro-300: #bdba90;
--color-saguaro-400: #a6a170;
--color-saguaro-500: #8f8850;
--color-saguaro-600: #797344;
--color-saguaro-700: #615c36;
--color-saguaro-800: #484326;
--color-saguaro-900: #322e19;
--color-saguaro-950: #1e1b0a;
}SCSS
$saguaro: #655f2d;
$saguaro-rgb: 101, 95, 45;
$saguaro-light: mix(#fff, $saguaro, 20%);
$saguaro-dark: mix(#000, $saguaro, 20%);
.element {
color: $saguaro;
box-shadow: 0 0 0 2px rgba($saguaro, 0.35);
}