Przejdź do treści

Generator schematu kolorów dla stron

Pełny jasny i ciemny motyw z koloru Twojej marki.

Ładowanie…

Wybierz kolor marki i otrzymaj gotowy schemat kolorów dla strony lub aplikacji: zabarwione tła i powierzchnie, obramowania, tekst i tekst pomocniczy, kolor główny dobrany tak, by pozostał czytelny, oraz pasujący akcent — dla motywu jasnego i ciemnego. Podgląd na żywo pokazuje kartę z tekstem i przyciskami, a cały schemat można skopiować jako zmienne CSS, gdzie ciemny motyw włącza się według ustawień systemu.

Jak utworzyć schemat kolorów strony

  1. Krok 1

    Wybierz kolor marki.

  2. Krok 2

    Sprawdź jasny i ciemny podgląd.

  3. Krok 3

    Skopiuj zmienne CSS.

Dlaczego PhotoTools

Jasny i ciemny

Dwa pasujące motywy naraz.

Czytelne od początku

Kolor główny i akcent mają kontrast co najmniej 3:1.

Gotowe do kodu

Zmienne CSS z trybem ciemnym.

Obsługiwane formaty

Wyjście

  • CSS

Najczęstsze pytania

Dlaczego kolor główny nieco różni się od mojego?

Jeśli Twój kolor jest zbyt jasny lub ciemny względem tła, zostaje przesunięty tylko na tyle, by osiągnąć kontrast 3:1 i zachować widoczność przycisków.

Jak użyć CSS?

Wklej go do arkusza stylów i używaj zmiennych, np. background: var(--color-primary). Ciemny motyw przełącza się według ustawień systemu.

Czy to jest darmowe?

Tak. Narzędzia PhotoTools działające w przeglądarce są darmowe, bez limitów i nie wymagają konta.

Czy moje zdjęcia są wysyłane na serwer?

Nie. To narzędzie działa w całości w Twojej przeglądarce dzięki WebAssembly. Zdjęcia nigdy nie opuszczają Twojego urządzenia i nic nie jest zapisywane.