Narzędzia
Motyw Tailwind z dowolnej strony
Wpisz adres strony i pobierz blok @theme dla Tailwind v4 z jej kolorami, rodzinami czcionek, zaokrągleniami, cieniami i breakpointami, gotowy do wklejenia do Twojego CSS.
Wypróbujstripe.comlinear.appairbnb.com
Jak to działa
Stylepack otwiera stronę w prawdziwej przeglądarce, mierzy to, co się renderuje (a nie to, co mówi arkusz stylów) w czterech szerokościach i w obu motywach, a wynik zapisuje jako pakiet designu. Strona już zmierzona odpowiada od razu; nowa zajmuje mniej niż minutę. Każda wartość na tej stronie pochodzi z tego pakietu.
Pytania
Czy to Tailwind v3, czy v4?
Tailwind v4: blok @theme w CSS. Dla v3 te same wartości są dostępne jako zmienne CSS i JSON w narzędziu palety kolorów oraz w tokens.json w pakiecie designu.
Co jest w motywie?
Kolory nazwane według roli, rodziny czcionek z ich darmowymi zamiennikami, skala zaokrągleń, cienie i breakpointy, przy których strona zmienia układ, wszystko zmierzone na żywej stronie.
Jak utrzymać go w zgodzie ze stroną?
Otwórz w dowolnej chwili stronę pakietu tej witryny: Stylepack okresowo mierzy ponownie zaindeksowane strony, a pakiet zawiera datę pomiaru.