Красный
Ступени опасности — разрушающие действия и ошибки. Ступени идут от светлого к тёмному; в дизайне напрямую
не используются — нужная ступень прокладывается через роль темы
TullsLight или
TullsDark. У цвета две шкалы: светлая (…N) и тёмная (…-darkN).
Ступени
| Variable | Value | Preview | Description |
|---|---|---|---|
--pallete-red1 | #fffcfc | Шаг 1: Фон страницы и приложения | |
--pallete-red2 | #fff7f7 | Шаг 2: Фон страницы и приложения | |
--pallete-red3 | #feebec | Шаг 3: Фон компонентов | |
--pallete-red4 | #ffdbdc | Шаг 4: Фон компонентов | |
--pallete-red5 | #ffcdce | Шаг 5: Фон компонентов | |
--pallete-red6 | #fdbdbe | Шаг 6: Границы и разделители | |
--pallete-red7 | #f4a9aa | Шаг 7: Границы и разделители | |
--pallete-red8 | #eb8e90 | Шаг 8: Границы и разделители | |
--pallete-red9 | #e5484d | Шаг 9: Заливка акцентных элементов | |
--pallete-red10 | #dc3e42 | Шаг 10: Заливка акцентных элементов | |
--pallete-red11 | #ce2c31 | Шаг 11: Текст | |
--pallete-red12 | #641723 | Шаг 12: Текст | |
--pallete-red-dark1 | #170f0e | Шаг 1: Фон страницы и приложения | |
--pallete-red-dark2 | #201312 | Шаг 2: Фон страницы и приложения | |
--pallete-red-dark3 | #3c1210 | Шаг 3: Фон компонентов | |
--pallete-red-dark4 | #520d0d | Шаг 4: Фон компонентов | |
--pallete-red-dark5 | #631413 | Шаг 5: Фон компонентов | |
--pallete-red-dark6 | #75221f | Шаг 6: Границы и разделители | |
--pallete-red-dark7 | #8e322d | Шаг 7: Границы и разделители | |
--pallete-red-dark8 | #b8433c | Шаг 8: Границы и разделители | |
--pallete-red-dark9 | #da2f2f | Шаг 9: Заливка акцентных элементов | |
--pallete-red-dark10 | #b5413a | Шаг 10: Заливка акцентных элементов | |
--pallete-red-dark11 | #ff9084 | Шаг 11: Текст | |
--pallete-red-dark12 | #ffd1cb | Шаг 12: Текст |
Альфа-ступени
Полупрозрачные варианты — тени, подложки, наложения
| Variable | Value | Preview | Description |
|---|---|---|---|
--alpha-pallete-red1 | #ff000003 | Шаг 1: Фон страницы и приложения | |
--alpha-pallete-red2 | #ff000008 | Шаг 2: Фон страницы и приложения | |
--alpha-pallete-red3 | #f3000d14 | Шаг 3: Фон компонентов | |
--alpha-pallete-red4 | #ff000824 | Шаг 4: Фон компонентов | |
--alpha-pallete-red5 | #ff000632 | Шаг 5: Фон компонентов | |
--alpha-pallete-red6 | #f8000442 | Шаг 6: Границы и разделители | |
--alpha-pallete-red7 | #df000356 | Шаг 7: Границы и разделители | |
--alpha-pallete-red8 | #d2000571 | Шаг 8: Границы и разделители | |
--alpha-pallete-red9 | #db0007b7 | Шаг 9: Заливка акцентных элементов | |
--alpha-pallete-red10 | #d10005c1 | Шаг 10: Заливка акцентных элементов | |
--alpha-pallete-red11 | #c40006d3 | Шаг 11: Текст | |
--alpha-pallete-red12 | #55000de8 | Шаг 12: Текст | |
--alpha-pallete-red-dark1 | #ec000007 | Шаг 1: Фон страницы и приложения | |
--alpha-pallete-red-dark2 | #f22f2011 | Шаг 2: Фон страницы и приложения | |
--alpha-pallete-red-dark3 | #fb170c2f | Шаг 3: Фон компонентов | |
--alpha-pallete-red-dark4 | #fe030346 | Шаг 4: Фон компонентов | |
--alpha-pallete-red-dark5 | #ff1a1758 | Шаг 5: Фон компонентов | |
--alpha-pallete-red-dark6 | #fd39326c | Шаг 6: Границы и разделители | |
--alpha-pallete-red-dark7 | #ff504786 | Шаг 7: Границы и разделители | |
--alpha-pallete-red-dark8 | #ff594fb3 | Шаг 8: Границы и разделители | |
--alpha-pallete-red-dark9 | #fe3434d8 | Шаг 9: Заливка акцентных элементов | |
--alpha-pallete-red-dark10 | #ff574db0 | Шаг 10: Заливка акцентных элементов | |
--alpha-pallete-red-dark11 | #ff9084 | Шаг 11: Текст | |
--alpha-pallete-red-dark12 | #ffd1cb | Шаг 12: Текст |