Rainstation Design System ↓
Message Content ↆ                       = Дизайн-система Дождевой Станции — исследование возможностей человеко-машинного интерфейса, используется для оформления метеоотчетов, содержащих погодные данные и личные заметки оператора. #simple #minimal #monochrome #typographic #flat #grid-based
Скоро здесь появятся разделы: Basic Principles Grid Color Scheme ↓ Typography ↓ Message Header Components Patterns ↓ Templates Examples ■
Color Scheme ↓
Description ■
Basic Colors
Color TITLE                       = Black hex                       = #000 ■
Color TITLE                       = Link hex                       = #007FFF ■
Color TITLE                       = White hex                       = #fff ■
Dark Colors
Color TITLE                       = Dark 2 hex                       = #101418 ■
Color TITLE                       = Dark 3 hex                       = #25292D ■
Color TITLE                       = Dark 4 hex                       = #34383C ■
Color TITLE                       = Dark 5 hex                       = #44484 ■
Color TITLE                       = Dark 1 hex                       = #000408 ■
Medium Colors
Color TITLE                       = Medium 2 hex                       = #7D8185 ■
Color TITLE                       = Medium 3 hex                       = #8A8D91 ■
Color TITLE                       = Medium 4 hex                       = #95999D ■
Color TITLE                       = Medium 5 hex                       = #A0A5A9 ■
Color TITLE                       = Medium 1 hex                       = #727579 ■
Light Colors
Color TITLE                       = Light 2 hex                       = #D1D4D8 ■
Color TITLE                       = Light 3 hex                       = #DADEE2 ■
Color TITLE                       = Light 4 hex                       = #E4E8EC ■
Color TITLE                       = Light 5 hex                       = #F7FBFF ■
Color TITLE                       = Light 1 hex                       = #C6CACE ■
Typography ↓
Description ■
Text Style Title                       = Small Text Font                       = Inter Regular Font Size                       = base unit Line Height                       = base unit × 2 Letter Spacing                       = 1px ■ →
Small Text, base unit
Text Style Title                       = Medium Text Font                       = Inter Regular Font Size                       = base unit × 2 Line Height                       = base unit × 3 Letter Spacing                       = 1px ■ →
Medium Text, base unit × 2
Text Style Title                       = Big Text Font                       = Inter Regular Font Size                       = base unit × 4 Line Height                       = base unit × 5 Letter Spacing                       = 1px ■ →
Big Text, base unit × 4
Text Style Title                       = Huge Text Font                       = Inter Regular Font Size                       = base unit × 8 Line Height                       = base unit × 10 Letter Spacing                       = 1px ■ →
Huge Text, base unit × 8
Patterns ↓
Description ■
IMAGE INFO ↆ TITLE                       = Rainstation Pattern 16 Background Color                       = Dark 1 Interval                       = 1/16 Stroke Width                       = 1 Stroke Color                       = Dark 3 Link                       = ▼ Download Image
IMAGE INFO ↆ TITLE                       = Rainstation Pattern 32 Background Color                       = Dark 1 Interval                       = 1/32 Stroke Width                       = 2 Stroke Color                       = Dark 5 ■
IMAGE INFO ↆ TITLE                       = Rainstation Pattern 64 Background Color                       = Dark 1 Interval                       = 1/64 Stroke Width                       = 4 Stroke Color                       = Medium 1 ■
IMAGE INFO ↆ TITLE                       = Rainstation Pattern 128 Background Color                       = Dark 1 Interval                       = 1/128 Stroke Width                       = 8 Stroke Color                       = Medium 3 ■
IMAGE INFO ↆ TITLE                       = Rainstation Pattern 256 Background Color                       = Dark 1 Interval                       = 1/256 Stroke Width                       = 16 Stroke Color                       = Medium 5 ■
IMAGE INFO ↆ TITLE                       = Rainstation Pattern 512 Background Color                       = Dark 1 Interval                       = 1/512 Stroke Width                       = 32 Stroke Color                       = Light 1 ■
IMAGE INFO ↆ TITLE                       = Rainstation Pattern 1024 Background Color                       = Dark 1 Interval                       = 1/1024 Stroke Width                       = 64 Stroke Color                       = Light 3 ■
IMAGE INFO ↆ TITLE                       = Rainstation Pattern 2048 Background Color                       = Dark 1 Interval                       = 1/2048 Stroke Width                       = 128 Stroke Color                       = Light 5 ■
Image Info ↆ Title                       = Rainstation Pattern 16 Background Color                       = Dark 1 Interval                       = 1/16 Stroke Width                       = 1 Stroke Color                       = Dark 3 ■
Image Info ↆ Title                       = Rainstation Pattern 32 Background Color                       = Dark 1 Interval                       = 1/32 Stroke Width                       = 2 Stroke Color                       = Dark 5 ■
Image Info ↆ Title                       = Rainstation Pattern 64 Background Color                       = Dark 1 Interval                       = 1/64 Stroke Width                       = 4 Stroke Color                       = Medium 1 ■
Image Info ↆ Title                       = Rainstation Pattern 128 Background Color                       = Dark 1 Interval                       = 1/128 Stroke Width                       = 8 Stroke Color                       = Medium 3 ■
Image Info ↆ Date, dd.mm.yyyy                       = 12.11.2021 Time, hh:mm                       = 20:46, GMT+3 Title                       = "Heavy Rain" Pattern File                       = JPG, 5.3Mb, 3840×2160px Link                       = ▼ Download Image