Siirry värivalitsimeen

HEX–SwiftUI-muunnin

Liitä HEX-arvo, niin saat SwiftUI-arvon heti. Myös muut muodot käyvät.

Tunnistettu: HEX

SwiftUI-arvoColor(red: 1, green: 0.341, blue: 0.2)
SwiftUI–HEX-muunnin

Säädä väriä

11°
100 %

68 %
0,210
34°

Kaikki muut muodot

HEX–SwiftUI-esimerkkejä

VäriHEXSwiftUI
#ff0000Color(red: 1, green: 0, blue: 0)
#00ff00Color(red: 0, green: 1, blue: 0)
#0000ffColor(red: 0, green: 0, blue: 1)
#ffffffColor(red: 1, green: 1, blue: 1)
#000000Color(red: 0, green: 0, blue: 0)
#808080Color(red: 0.502, green: 0.502, blue: 0.502)
#ff5733Color(red: 1, green: 0.341, blue: 0.2)
#3b82f6Color(red: 0.231, green: 0.51, blue: 0.965)
#10b981Color(red: 0.063, green: 0.725, blue: 0.506)
#f59e0bColor(red: 0.961, green: 0.62, blue: 0.043)
#8b5cf6Color(red: 0.545, green: 0.361, blue: 0.965)
#ec4899Color(red: 0.925, green: 0.282, blue: 0.6)

Tietoa muodoista HEX ja SwiftUI

HEX kirjoittaa punaisen, vihreän ja sinisen kukin kahdella heksadesimaalinumerolla, esimerkiksi #ff5733. Se on yleisin tapa merkitä värejä verkossa ja suunnittelutyökaluissa.

SwiftUI kuvaa värin punaisella, vihreällä ja sinisellä välillä 0–1, esimerkiksi Color(red: 1, green: 0.341, blue: 0.2). Peittävyys lisätään opacity-parametrilla.

Näin muunnos toimii

Luemme HEX-arvon, muunnamme sen CIE XYZ -avaruuteen CSS Color 4 -määrityksen matriiseilla ja siitä edelleen SwiftUI-muotoon. Kohdevärialueen ulkopuoliset arvot sovitetaan CSS Color 4:n algoritmilla, joka säilyttää vaaleuden ja sävyn ja pienentää kromaa.

Kysymyksiä ja vastauksia

Miten muunnan HEX-arvon SwiftUI-muotoon?

Liitä tai kirjoita HEX-arvo yllä olevaan kenttään. PickShade muuntaa sen CSS Color 4 -kaavoilla jo kirjoittaessasi, ja SwiftUI-arvon kopioit yhdellä napsautuksella.

Onko HEX–SwiftUI-muunnos tarkka?

Laskenta on tarkka, ja tulos pyöristetään vain näyttämistä varten niin moneen numeroon, että takaisin muunnettuna saat saman värin. Jos väri ei mahdu kohdevärialueelle, PickShade varoittaa ja näyttää lähimmän värin, joka mahtuu.

Saanko muut muodot samalla kertaa?

Kyllä. Kaikki muut muodot, myös OKLCH, Display P3, Tailwind, SwiftUI, Flutter ja Android, näkyvät tuloksen alla, ja ne kopioituvat yhdellä napsautuksella.

Onko muunnin ilmainen?

Kyllä. Se on ilmainen, ei vaadi rekisteröitymistä ja toimii kokonaan selaimessasi.