Generator przycisków

To narzędzie buduje przycisk CSS na podstawie tekstu, kolorów, rozmiarów, obramowania, efektu najechania i opcjonalnego box-shadow, z podglądem na żywo, na który można najechać kursorem. Generuje klasę `.button { ... }` z `transition: all 0.2s ease` oraz osobną regułę `.button:hover` opartą na wybranym efekcie najechania (przyciemnij, rozjaśnij, unieś lub brak).

1. Wpisz tekst przycisku (wartość domyślna to Click Me). 2. Wybierz kolory tła i tekstu za pomocą selektorów kolorów lub pól hex. 3. Dostosuj Rozmiar czcionki (10-32px), Padding X (8-48px), Padding Y (4-24px) i Promień zaokrąglenia (0-50px) suwakami. 4. Ustaw Kolor obramowania i Szerokość obramowania (0-5px). 5. Wybierz Efekt najechania: przyciemnij, rozjaśnij, unieś lub brak. 6. Opcjonalnie włącz Cień i dostosnij Rozmycie, Przesunięcie X i Przesunięcie Y. 7. Najedź na podgląd, aby zobaczyć efekt; kliknij Kopiuj na karcie Wynik CSS.

Przyciemnij/rozjaśnij zmieniają kolor tła o +/-30 jednostek RGB za pomocą `adjustBrightness`. Unieś stosuje przy najechaniu `transform: translateY(-2px)` oraz `box-shadow: 0 4px 8px rgba(0,0,0,0.2)`. Brak całkowicie pomija regułę najechania. Wynikiem jest pojedyncza reguła `.button` zawierająca background-color, color, font-size, padding, border-radius, border, cursor, transition oraz opcjonalny box-shadow, po którym następuje blok `.button:hover`, gdy ma zastosowanie. Nie jest generowany żaden HTML.