Wdrożenie i CMS
Design tokens
Design tokens to nazwane wartości, z których zbudowany jest design system: kolor nazwany „surface-dark”, jednostka odstępu „space-md”, rozmiar tekstu „heading-2”. Elementy odwołują się do tokenu, nie do surowej wartości.
Korzyścią jest pośredniość. Jeśli czterdzieści elementów używa surowej wartości #2547ff i firmowy niebieski się zmienia, potrzeba czterdziestu edycji. Jeśli odwołują się do tokenu „brand-primary”, potrzeba jednej. Tokeny niosą też znaczenie: wykonawca czytający „surface-dark” wie, do czego to służy, w sposób, którego #0d0d0d nie przekazuje.
W Webflow tokeny to zmienne, pogrupowane w kolekcje i stosowane w projektancie. Mogą mieć tryby, więc ten sam token daje różne wartości w jasnym i ciemnym motywie albo przy różnych progach. Tak jeden zestaw komponentów obsługuje kilka kontekstów wizualnych bez duplikacji.
Mały zestaw tokenów bije duży. Pięć czy sześć rozmiarów tekstu, skala odstępów z sześciu lub siedmiu kroków, kilkanaście kolorów z nazwami semantycznymi. Więcej i ludzie przestają ich używać, co wraca stronę do surowych wartości z dodatkowymi krokami.
Zmienne i tokeny w WebflowWdrożenie i CMS