Chcę zrobić mieszanki SASS dla mojej kolorystyki w stylu tailwind.

Dla każdego koloru chcę wygenerować wersję 400, 300, 200, 100 i tak dalej.

Teraz byłoby miło wiedzieć, w jakim procencie jest to wiatr w tył.

Nie znalazłem w internecie nic na ten temat.

2
Slowwie 31 marzec 2020, 21:34

3 odpowiedzi

Najlepsza odpowiedź

Do generowania używam https://javisperez.github.io/tailwindcolorshades/#/ odcienie, to wypisze coś takiego:

  concrete: {
    100: '#FEFEFE',
    200: '#FCFCFC',
    300: '#FAFAFA',
    400: '#F6F6F6',
    500: '#F2F2F2',
    600: '#DADADA',
    700: '#919191',
    800: '#6D6D6D',
    900: '#494949',
  },

Możesz to uwzględnić w swoim pliku tailwind.config.js.

1
quarks 4 kwiecień 2020, 09:43

Znalazłem tę wtyczkę figma: https://www.figma.com/ community / plugin / 815578663120885543 / Tailwind-Color-Generator

Spowoduje to wygenerowanie niestandardowej palety kolorów do wykorzystania w projektach, a następnie wyeksportowanie jej do plików SCSS - wynik powinien być taki sam.

0
halfer 27 sierpień 2020, 16:59

Wszystkie domyślne kolory Tailwind są wybierane ręcznie, nie mają one narzędzia do generowania palet kolorów, więc musiałbyś zrobić to samo.

Z dokumentów:

Generowanie niestandardowych palet kolorów

Często pojawia się pytanie „jak wygenerować 100–900 odcieni moich własnych kolorów niestandardowych?”.

Zła wiadomość: kolor jest skomplikowany i nie znaleźliśmy jeszcze narzędzia, które dobrze radzi sobie z generowaniem tego rodzaju palet kolorów. Ręcznie wybraliśmy wszystkie domyślne kolory Tailwind, równoważąc je na oko. Przepraszam!

0
Remul 1 kwiecień 2020, 09:39