Палитра Весна

CSS-переменные

:root {
  --color-1: #FFAFCC;
  --color-2: #FFC8DD;
  --color-3: #BDE0FE;
  --color-4: #A2D2FF;
  --color-5: #CDB4DB;
}

Конфиг Tailwind

// tailwind.config.js
colors: {
  "spring-1": "#FFAFCC",
  "spring-2": "#FFC8DD",
  "spring-3": "#BDE0FE",
  "spring-4": "#A2D2FF",
  "spring-5": "#CDB4DB",
}

Об этой палитре

Палитра Весна (Spring) — подобранный набор из 5 цветов с HEX, RGB и готовым экспортом в CSS-переменные и Tailwind. Нажмите на любой свотч для подробностей цвета — конвертаций, контраста и гармоний.

Читаемый текст на каждом цвете

Белый и почти чёрный измерены на каждом свотче. AA значит, что пара берёт 4,5:1 для основного текста; «Только крупный» — что берёт лишь 3:1, и годится от 24px.

#FFAFCCПочти чёрный11.03:1AA

#FFC8DDПочти чёрный13.10:1AA

#BDE0FEПочти чёрный13.73:1AA

#A2D2FFПочти чёрный11.87:1AA

#CDB4DBПочти чёрный10.03:1AA

Эти цвета друг на друге

Ни одно из 20 сочетаний внутри палитры не дотягивает до 4,5:1 — сочетайте её цвета с белым или почти чёрным, а не друг с другом.

текст \\ фон	#FFAFCC	#FFC8DD	#BDE0FE	#A2D2FF	#CDB4DB
#FFAFCC	·	1.19Не проходит	1.24Не проходит	1.08Не проходит	1.10Не проходит
#FFC8DD	1.19Не проходит	·	1.05Не проходит	1.10Не проходит	1.31Не проходит
#BDE0FE	1.24Не проходит	1.05Не проходит	·	1.16Не проходит	1.37Не проходит
#A2D2FF	1.08Не проходит	1.10Не проходит	1.16Не проходит	·	1.18Не проходит
#CDB4DB	1.10Не проходит	1.31Не проходит	1.37Не проходит	1.18Не проходит	·

Ещё палитры

Смотрите также

Градиенты в той же гамме

Румянец Сияние Пастель