Wygeneruj jaśniejsze i ciemniejsze odcienie koloru

Projektantom i opiekunom marki pomaga ono dobrać jaśniejsze i ciemniejsze odcienie koloru do spójnej palety interfejsu, prezentacji lub materiałów reklamowych.

Wygeneruj jaśniejsze i ciemniejsze odcienie koloru. Całe przetwarzanie odbywa się w przeglądarce; wpisane dane nie są wysyłane, udostępniane ani zapisywane.

Jak używać

Wpisz kolor bazowy w formacie szesnastkowym w polu wprowadzania.
Uruchom generator, aby utworzyć jaśniejsze i ciemniejsze warianty.
Przejrzyj propozycje i wybierz odcienie pasujące do Twojego interfejsu.
Wypróbuj inny kolor bazowy, jeśli proponowana paleta nie odpowiada Twojemu celowi.
Skopiuj wybrane wartości do swojego systemu projektowego lub arkusza stylów.

Przykład

W przypadku dostarczonego niebieskiego przykładu zobacz, jak odcień rozwija się w jaśniejsze i ciemniejsze tony. Pomaga to tworzyć stany hover, active lub disabled bez zaczynania od pustej strony.

Dane wejściowe

#2563EB

Wynik

100: #BED0F9
300: #719AF2
500: #2563EB
700: #1C4AB0
900: #133276

Ograniczenia i formaty

Narzędzie proponuje warianty na podstawie jednego koloru, ale nie sprawdza dostępności.
Wygenerowane tony nie zastępują sprawdzonej palety marki.
Przetestuj każdą wartość w prawdziwym interfejsie, ponieważ warunki wyświetlania mogą zmieniać wygląd.
Jasny lub ciemny wariant może nie sprawdzić się na niektórych tłach, nawet jeśli wygląda poprawnie na liście.

Gdzie odbywa się przetwarzanie

Generowanie odbywa się w Twojej przeglądarce. Kolor bazowy nie jest wysyłany na zewnątrz, a strona nie zapisuje żadnej palety. W tej samej sesji możesz wypróbować kilka kolorów bazowych.

Częste pytania

Czy mogę zacząć od konkretnego koloru?

Tak, wpisz kolor bazowy w formie szesnastkowej. Narzędzie użyje go do obliczenia zestawu jaśniejszych i ciemniejszych wariantów.

Czy warianty są dostępne?

Oferują pomysły na kontrast, ale narzędzie nie mierzy zgodności. Sprawdź pary tekstu i tła za pomocą odpowiedniego narzędzia do sprawdzania kontrastu.

Ile kolorów mogę wygenerować?

Proces rozpoczyna się od jednego koloru i zwraca kilka tonów. Aby uzyskać pełną paletę, powtórz go dla każdego głównego koloru w projekcie.

Czy wygenerowane warianty zastępują zatwierdzoną paletę marki?

Nie. Wygenerowane odcienie nie zastępują zatwierdzonej palety marki. Narzędzie proponuje warianty na podstawie jednego koloru i nie sprawdza dostępności. Każdą propozycję przetestuj w prawdziwym interfejsie, na docelowym tle i w różnych warunkach wyświetlania. Lekki lub ciemny wariant może wyglądać dobrze na liście, a mimo to zawodzić w praktyce.

Czy kolor bazowy jest wysyłany lub zapisywany?

Generowanie odbywa się w przeglądarce. Kolor bazowy nie jest wysyłany na zewnątrz i nie jest zapisywany przez stronę. Możesz więc wypróbować kilka kolorów bazowych w tej samej sesji. Jeśli chcesz zachować wybrane wartości, skopiuj je do swojego systemu projektowego lub arkusza stylów. Narzędzie nie tworzy trwałego zapisu palety.