Design system · v1.0

Інженерна зелень

Візуальна мова ТЕХНОБУДТРАНС: глибока хвоя та бетонний пісок, технічний гротеск, прямі кути й сітка як конструкція. Стримано, документально, без декору.

01

Палітра

pine-deep
var(--pine-deep)

Фон темних секцій, футер

pine
var(--pine)

Primary, кнопки, акценти

moss
var(--moss)

Ring, графіки, hover

sage
var(--sage)

Accent, підписи на темному

sand
var(--sand)

Secondary, блоки-підложки

paper
var(--paper)

Основний фон

steel
var(--steel)

Технічні мітки, схеми

destructive
var(--destructive)

Помилки, попередження

02

Типографіка

H1 · Archivo 700 · -2% · uppercase
БУДУЄМО МІСТО
H2 · Archivo 700 · -2%
НАПРЯМИ РОБІТ
H3 · Archivo 700
ТОВАРНИЙ БЕТОН
Body · IBM Plex Sans 400 · 16/1.7

Ми виробляємо бетон на власних вузлах, доставляємо його власним транспортом і зводимо об'єкти власними бригадами.

03

Кнопки та стани

Disabled
04

Поверхні та тіні

Flat

Базова картка, лише 1px межа.

Raised

Форми, спливаючі блоки.

Pine

Темні секції, футер, CTA.

05

Сітка та радіуси

Колонки 12 · gutter 24px · max 1400px
Радіус 2px — майже прямий кут
none
sm
md
lg