- 74 brands: airbnb, stripe, apple, figma, linear, vercel, etc. - 147 files: DESIGN.md + README.md per brand (~2.1 MB) - Each DESIGN.md contains structured brand analysis (colors, typography, components) - Updated 00-overview.md with new design-systems directory
1.3 KiB
1.3 KiB
title, created, updated, type, tags, sources, confidence
| title | created | updated | type | tags | sources | confidence | ||||
|---|---|---|---|---|---|---|---|---|---|---|
| Responsive Grid and Layout | 2026-06-02 | 2026-06-02 | concept |
|
|
high |
Responsive Grid and Layout — Сетки и раскладка
Сетки
- 12-колоночная — стандарт для desktop (1440px+)
- 4-колоночная — для mobile (360×800)
- Bento Grid — модульная сетка (Apple-стиль, популярна в 2025–2026)
- CSS Grid — для макета страницы
- Flexbox — для компонентов
Container Queries
Новый стандарт адаптивности: компонент подстраивается под свой контейнер, а не viewport. Позволяет: один компонент → разная раскладка в разных контекстах.
White Space
Cluttered = cheap. Spacious = premium. Crawford: "white space = секрет премиальности".
Mobile-First Layout
Начинать с 1 колонки, добавлять колонки на больших экранах. Content → sidebar → header → footer — порядок в HTML может отличаться от визуального.