Тени
Четыре уровня, и они семантические, а не декоративные: тень говорит, что над чем. Выпадающая панель выше карточки, модальное окно выше страницы — уровень следует за слоем, а не за настроением.
- Elevation объявляется в каждой теме отдельно. Полупрозрачная тёмная тень на тёмном фоне не даёт ничего: поверхность теряет один из двух каналов подъёма, и страница читается одним полотном.
Тени
| Токен | Значение | Роль |
|---|---|---|
--gr-shadow-0--gr-shadow-0 | none | Уровень elevation 0 для карточек, popover-слоёв и акцентных поверхностей. |
--gr-shadow-1--gr-shadow-1 | 0 1px 2px rgba(15, 23, 42, 0.08) | Уровень elevation 1 для карточек, popover-слоёв и акцентных поверхностей. |
--gr-shadow-2--gr-shadow-2 | 0 8px 24px rgba(15, 23, 42, 0.14) | Уровень elevation 2 для карточек, popover-слоёв и акцентных поверхностей. |
--gr-shadow-3--gr-shadow-3 | 0 16px 48px rgba(15, 23, 42, 0.20) | Уровень elevation 3 для карточек, popover-слоёв и акцентных поверхностей. |
Источник: @feugene/granularity 0.41.0, tokens/*.json