🎨 Design Systems

Dark mode — co to jest?

Alternatywny schemat kolorów interfejsu, w którym tło jest ciemne, a tekst jasny. Wymaga odrębnego zestawu design tokenów i przemyślanego podejścia do kontrastu.

Jak to działa?

Dark mode to nie proste odwrócenie kolorów. Musisz zaprojektować odrębną paletę, w której: tła używają odcieni szarości (nie czystej czerni), tekst jest delikatnie przytłumiony (nie czysta biel, bo razi w oczy), kolory akcentów są mniej nasycone, a elevation (głębokość) wyraża się jasnością, nie cieniem. Na przykład, karta w light mode ma cień, a w dark mode jest po prostu jaśniejsza niż tło. Design tokeny są tu kluczowe: definiujesz color-background-primary jako biały w light i ciemnoszary w dark.

Dlaczego to ważne?

Coraz więcej użytkowników preferuje dark mode, zwłaszcza wieczorem. Źle zaimplementowany dark mode psuje czytelność i wygląda jak tani hack, a nie profesjonalna funkcja.

Powiązane pojęcia

Chcesz wiedzieć więcej?

Naucz się wdrażać dark mode w Design Systemie

Sprawdź Design System Masterclass →