⭐ 0
🔍
Tekst Billede PDF & Docs Lyd Musik Elektronik Tid Hjælpeprogrammer Validatorer Esoterisk Spil

CSS Conic Gradient Generator

Byg CSS-gradienter visuelt: lineær, radial eller konisk type, vinkelskyder og op til seks farvestop med en live forhåndsvisning i fuld bredde og kopierbar kode.

90°
Behandler... 0%

Resultat

Denne side åbner gradientgeneratoren med den koniske type allerede valgt: i stedet for at falme langs en linje eller ud fra midten, fejer farverne rundt om midten som en urviser, startende fra den vinkel, du indstiller på skyderen.

conic-gradient() er den nyeste af de tre CSS-gradientfunktioner og den bag cirkeldiagrammer, farvehjul og iøjnefaldende roterende-kanteffekter. Stoppositioner i procent er positioner rundt om cirklen - to stop ved 0% og 100% blandes jævnt hele vejen rundt, mens stop placeret tæt sammen skaber sprøde kiler.

Juster startvinklen og stopper, indtil forhåndsvisningen læser rigtigt, og kopier derefter baggrundslinjen. Alle moderne browsere understøtter koniske gradienter, så koden er sikker at sende.

🛡️
Udføres i browser

Dine filer og input forlader aldrig denne enhed. Behandlingen kører helt offline. 100 % sikker.

Accepterede formater og regler

  • Valg af gradienttype (lineær, radial, kegleformet) med en vinkelskyder til lineære og koniske tilstande.
  • Farvestopliste: to stop til at starte, tilføje eller fjerne op til seks, hver med sin egen farvevælger og position i procent.
  • Kopierbar baggrund CSS-linje plus færdige forudindstillede sider til solnedgang, hav og pastelfarver.

Vigtige fordele

✓ Forhåndsvisningen i fuld bredde males igen ved hver ændring - type, vinkel og hvert farvestop - så den CSS, du kopierer, er præcis, hvad du så.
✓ Op til seks farvestop med individuelle positioner dækker alt fra en simpel tofarvet fade til komplekse multi-band baggrunde.
✓ En erklæring, tre motorer: skift mellem lineær, radial og konisk uden at genopbygge dine stop.

Brug Cases

  • • Komponer en heltesektionsbaggrund ved at trække i vinkel- og farvestoppene i stedet for at håndredigere linear-gradient() og genindlæse.
  • • Sammenlign de samme farvestop som lineære, radiale og kegleformede gradienter med en kontakt - stopperne overføres mellem typerne.
  • • Få fat i en gennemprøvet kombination fra siden med forudindstilling af solnedgang, hav eller pastel, og juster den til dit brands farver.