Wstecz

Eksportuj paletę kolorów do pliku zmiennych SCSS/LESS/CSS

Każdą paletę na ColorsWall można pobrać jako plik albo jako gotowe zmienne, dzięki czemu te same kolory trafią do narzędzia projektowego i do kodu.

jak wyeksportować paletę kolorów do pliku zmiennych SCSS/LESS/CSS?
  1. Znajdź swoją paletę lub stwórz nową
  2. Otwórz łącze z paletą (Na przykład: Bootstrap 4 Kolory )

    Działa to na stronie każdej palety, twojej lub cudzej.

  3. Naciśnij przycisk «Eksportuj»

    Zakładka «Pliki» pobiera paletę jako ASE (Adobe Swatch Exchange, dla Photoshopa i Illustratora), SVG lub JSON. Zakładki CSS, SCSS i LESS pokazują kolory jako zmienne, a zakładka «Kolory» daje zwykłą listę kodów HEX w pliku .txt.

    jak wyeksportować paletę kolorów do pliku zmiennych SCSS/LESS/CSS
  4. Wybierz typ pliku SCSS, LESS lub CSS i naciśnij przycisk «Pobierz»

    Zmienne dostają nazwy od nazw kolorów w palecie, np. --color-sky-blue, albo są numerowane --color-1, --color-2, gdy kolor nie ma nazwy. Plik CSS umieszcza je w :root, więc działa od razu.

  5. Zapisz plik i ciesz się.
Eksportuj paletę kolorów do pliku zmiennych SCSS/LESS/CSS film instruktażowy

Wolisz obejrzeć? Poniższy film krok po kroku pokazuje eksport palety.