Generátor přechodů
CSS generátor přechodů vytváří lineární, radiální a kónické přechody ze dvou nebo tří barev s živým náhledem a CSS pro background připraveným ke zkopírování.
O tomto nástroji
CSS generátor přechodů vytváří lineární, radiální a kónické přechody ze dvou nebo tří barev s živým náhledem a CSS pro background připraveným ke zkopírování.
Jak ho použít
- Zvol typ přechodu: lineární, radiální nebo kónický.
- Nastav úhel posuvníkem (0–360°).
- Vyber dvě barvy, nebo zaškrtni Použít 3 barvy a přidej třetí.
- Klikni na Kopírovat CSS a vlož pravidlo background do svého stylesheetu.
Dobré vědět
- linear-gradient() prolíná barvy podél přímky určené úhlem, přičemž 90deg vede zleva doprava.
- radial-gradient(circle, …) rozprostírá barvy od středu ven.
- conic-gradient(from <angle>, …) otáčí barvy kolem středového bodu, což se hodí pro koláčové grafy a barevná kola.
- CSS přechody jsou obrázky vykreslované prohlížečem, takže se přizpůsobí libovolné velikosti bez dalších dat ke stažení.
- Všechny tři funkce přechodů podporují všechny současné hlavní prohlížeče.
Běží celý ve vašem prohlížeči — nic, co zadáte, se nenahrává ani neukládá.
Časté dotazy
Jak vytvořím CSS přechod?
Použij funkci přechodu jako pozadí, například background: linear-gradient(135deg, #1db954, #0a1628). Tento nástroj ti ten řádek napíše podle zvolených barev a úhlu.
Jaký je rozdíl mezi lineárním, radiálním a kónickým přechodem?
Lineární přechod mění barvu podél přímky, radiální se šíří ze středového bodu a kónický se otáčí kolem středu jako ručičky hodin.
Může mít přechod víc než dvě barvy?
Ano. CSS přechody přijímají libovolný počet barevných zastávek. Tento generátor podporuje dvě nebo tři barvy; další zastávky můžeš do zkopírovaného CSS přidat ručně.
Zpomalují CSS přechody web?
Ne znatelně. Vykresluje je prohlížeč a nestahuje se žádný obrázek, takže jsou obvykle lehčí než obrázkové soubory s přechodem.