Color Format Converter teisendab mis tahes värvi HEX, RGB, HSL, HSV ja OKLCH vahel. Valige värv sisseehitatud värvivalijaga, sisestage heksväärtus, kleepige mis tahes CSS värvistring või kohandage RGB liugureid — iga vorming uueneb reaalajas ja igaühel on oma kopeerimisnupp.
Kaasaegne CSS annab tosin võimalust kirjutada sama värv: #7C3AED, rgb(124, 58, 237), hsl(262, 83%, 58%), oklch(55% 0.24 293), pluss iga vormingu alfa-variandid. Sageli on vaja nende vahel teisendada — Figma disain annab teile OKLCH väärtuse, teie koodibaas kasutab HEX-i ja teie teema muutujad eelistavad hover-kohanduste jaoks HSL-i. Color Format Converter teeb kõik teisendused ühel paneelil. Valige värv sisseehitatud värvivalijast, kleepige olemasolev värv mis tahes süntaksis või lohistage RGB liugureid, et see täpseks häälestada. Iga levinud vorming kuvatakse samaaegselt: HEX (koos alfaga), rgb()/rgba(), hsl()/hsla(), hsv() ja oklch() — pluss CSS muutuja koodilõik ja arvutatud heleduse väärtus kiireks kontrastiarvutuseks. Alfakanal on toetatud läbivalt. Igal vormingul on oma kopeerimisnupp üheklõpsuliseks kasutamiseks ja parser aktsepteerib sisseehitatud värvinimesid ning kõike, mida CSS toetab.
Kuvab HEX, RGB/RGBA, HSL/HSLA, HSV ja OKLCH samaaegselt — valige, mis tahes vorming, mida teie sihtkood ootab, ilma iga kord uuesti teisendamata.
Aktsepteerib HEX (#abc või #aabbcc või #aabbccff), rgb()/rgba(), hsl()/hsla(), oklch() ja sisseehitatud värvinimesid. Kleepige kõike, mida CSS toetab.
Käsitleb uut OKLCH vormingut, mida kasutatakse kaasaegses CSS-is — tajumuslikult ühtlane värviruum, mis on saamas uueks disainisüsteemi vaikeväärtuseks.
Igal väljundil on oma kopeerimisnupp. Klõpsake, et saada täpselt see vorming, mida teie kood vajab, ilma käsitsi valimiseta.
Kohandage Red/Green/Blue/Alpha liugureid täpseks häälestuseks. Iga vorming uueneb lohistamise ajal reaalajas.
Läbipaistvus on käsitletud igas vormingus: #RRGGBBAA, rgba(...), hsla(...). Määrake üks kord, teisendatud kõikjal.
Figma annab teile OKLCH või HSL väärtuse — kleepige see, kopeerige HEX vaste oma Tailwindi konfiguratsiooni või CSS muutujate jaoks ilma brauserit lahkumata.
Lohistage liugureid toonide uurimiseks, märkides üles OKLCH väärtused süstemaatilise disainisüsteemi paleti jaoks.
Teisendage brändivärv selle HSL kujule, et saaksite hover-olekute jaoks kasutada hsl(var(--brand-h) var(--brand-s) calc(var(--brand-l) + 10%)).
Luminance väli annab WCAG kontrastiarvutustes kasutatava toorväärtuse — kasulik a11y matemaatika jaoks.
Kleepige loetavast CSS failist oklch(...) väärtus ja nähke koheselt, millise värvi see tegelikult toodab.
Klõpsake DevSuite Pro dokis Color Formats ikooni. Avaneb paneel värvivalija, heksisisendi ja RGB liuguritega.
Kasutage värvivalijat, sisestage heksväärtus või kleepige mis tahes CSS värvistring (rgb(...), oklch(...) jne). Värv eelvaadatakse koheselt.
Iga vorming kuvatakse allpool: HEX, RGB, HSL, HSV, OKLCH, CSS muutuja ja heledus. Kõik jäävad kohandamisel sünkroonis.
Lohistage R/G/B/A liugureid peente kohanduste jaoks. Suurepärane konkreetse disainispetsifikatsioonile vastava tooni häälestamiseks.
Klõpsake vajaliku vormingurea juures Copy — väärtus jõuab teie lõikelauale õiges süntaksis.
Paigaldage DevSuite Pro tasuta ja avage 64+ arendustööriista oma brauserile.
