← Прототипът

NOISY дизайн система

Работни токени и компоненти на пилота Theater, чакащи одобрение. Зоните имат различни стилове. Интерактивните примери работят само в този каталог.

Генерирано от design-system/tokens.css и components.css · 45 токена · 4 вида бутони

Цветове

Spectrum

--n-violet: #B61DFF

--n-magenta: #CE13A8

--n-red: #FF0000

--n-spectrum: linear-gradient(90deg, #B61DFF 0%, #CE13A8 33%, #FF0000 100%)

--n-branded: linear-gradient(90deg, #8024B6 0%, #8C238D 45%, #B2261B 100%)

бутон Branded

Повърхности (тъмна тема на приложението)

--bg: #0E0E0F

--bg-raise: #161618

--surface: #1E1E20

--surface-2: #262628

--chip: #323232

бутон Default

--line: rgba(255, 255, 255, .08)

--line-strong: rgba(255, 255, 255, .16)

Текст

--fg: #FBFBFB

--fg-2: #B4B4B8

--fg-3: #868688

Premium Films: топло злато, отделно от Spectrum, за да не изглежда като забранено

--premium: #E8C37A

--premium-ink: #1A1408

--premium-line: rgba(232, 195, 122, .45)

Оценки

--tomato: #FA320A

Типография

--font-body: Manrope, system-ui, -apple-system, sans-serif

Избери какво да гледаш · Theater

--font-head: Unbounded, Manrope, system-ui, sans-serif

Избери какво да гледаш · Theater

--t-2xs: 11px

етикети върху карти (tag)

Избери какво да гледаш · Theater

--t-xs: 12px

надзаглавия, източници, часове

Избери какво да гледаш · Theater

--t-sm: 13px

вторичен текст, мета

Избери какво да гледаш · Theater

--t-md: 14px

контроли, навигация

Избери какво да гледаш · Theater

--t-base: 15px

основен текст, бутони

Избери какво да гледаш · Theater

--t-lg: 16px

заглавия на карти

Избери какво да гледаш · Theater

--t-xl: 18px

заглавия на секции

Избери какво да гледаш · Theater

--t-2xl: 22px

заглавие на страница, телефон

Избери какво да гледаш · Theater

--t-3xl: 28px

голямо заглавие

Избери какво да гледаш · Theater

--t-4xl: 32px

заглавие на страница, десктоп

Избери какво да гледаш · Theater

Разстояния и радиуси

--r-sm: 8px

бутони, чипове

--r-md: 12px

карти

--r-lg: 16px

панели

--s-1: 4px

--s-2: 8px

--s-3: 12px

--s-4: 16px

--s-5: 24px

--s-6: 32px

--s-7: 48px

--s-8: 64px

Бутони

.btn .btn-primary

.btn .btn-branded

.btn .btn-default

.btn .btn-premium

Други токени

--ctl-h: 40px

--ease: cubic-bezier(.2, .7, .2, 1)

--dur: 180ms

Филтри и обхват

Drop · .drop .ctl .drop-menu

Chips · .chips .chip

ScopeSwitch · .scope

Карти на заглавия

TitleCard · .card

С постер

Сериал

Ергенът

от 2023 · 3 сезона · Риалити

71%

NOVA · До 5 ное

Без постер

Откраднат живот

Сериал

Откраднат живот

от 2016 · 9 сезона · Драма

74%

NOVA · До 12 ное

Premium

ФилмPREMIUM

Дюн: Част втора

2024 · 2 ч 46 мин · Научна фантастика, Приключение

92%95%

Premium Films

С прогрес

Сериал

Ергенът

от 2023 · 3 сезона · Риалити

71%

NOVA · До 5 ное

TitleCard compact · .card-compact

С постер

Сериал

Без постер

Откраднат живот

Сериал

Premium

ФилмPREMIUM

С прогрес

Сериал

TitleCard wide · .card-wide

С постер

Сериал

Ергенът

от 2023 · 3 сезона

Без постер

Откраднат живот

Сериал

Откраднат живот

от 2016 · 9 сезона

Premium

ФилмPREMIUM

Дюн: Част втора

2024 · 2 ч 46 мин

С прогрес

Сериал

Ергенът

от 2023 · 3 сезона

Art · .entry-fan · 64px

Откраднат живот

Хора

PersonCard · .pcard

CN

Christopher Nolan

Режисьор · 1 заглавие в NOISY

Зареждане

Skeleton · .skel

Skeleton wide · .skel-wide

Празен резултат

Empty · .empty

Нищо не отговаря на филтрите

Махни някой от филтрите или изчисти търсенето.

ЕПГ блокове

.prog .past

Минало предаване20:00 - 21:00

.prog .live

На живо20:00 - 21:00

.prog .rec

Записва се20:00 - 21:00

.prog .noend

Без час на край20:00 · Без край