Kas ir HEX‑to‑RGB konvertēšana?
HEX (heksadecimālais) krāsu kods ir sešu zīmju virkne, kas sākas ar #, piemēram, #4f46e5. To ikdienā lieto CSS un citos tīmekļa rīkos, jo tas ir ļoti kompakts. Katrs krāsu kanāls – sarkanais (R), zaļais (G) un zilais (B) – tiek attēlots ar divām hex zīmēm. Piemēram, #4f46e5 nozīmē: sarkanais 4f, zaļais 46, zilais e5. Savukārt RGB vērtības ir trīs decimālie skaitļi robežās no 0 līdz 255, kas precīzi atbilst šiem pašiem trim kanāliem, tikai izteiktiem parastajā desmitnieku sistēmā. Šīs lapas galvenais uzdevums ir acumirklīgi pārvērst heksadecimālo kodu RGB skaitļos, ļaujot jums kopēt tos tieši kodā vai dizaina programmā.
Kā šī lapa strādā atšķirīgi?
Daudzi tiešsaistes konvertētāji vienkārši parāda RGB vērtību, bet šī lapa izceļas ar vairākām specifiskām īpašībām. Tā pārvērš heksadecimālo (bāze‑16) krāsas attēlojumu decimālajā (bāze‑10) RGB kanālos, ko tieši izmanto displeji un krāsu sajaukšanas matemātika. HEX kodi būtībā ir tā paša trīs 8 bitu kanālu saīsinājums, ko RGB izrāda skaitliski. Tāpēc šeit tiek ievēroti stingri noteikumi:
- HEX kodi ir doti kā seši cipari (
#RRGGBB) vai trīs ciparu saīsinājums (#RGB), kur katrs saīsinājuma cipars tiek dublēts, veidojot pilnu sešu ciparu kodu. #priekšā nav obligāts; rīks pieņem kodus gan ar, gan bez tā.- Mērķa RGB kanāli vienmēr ir veseli skaitļi no 0 līdz 255, bez alfa kanāla (astoņu ciparu HEX kodi ar alfa netiek apstrādāti; lapa sagaida tikai sešu vai trīs ciparu HEX).
- Pārvēršana ir stingri matemātiska: katrs hex ciparu pāris tiek reizināts ar 16 pakāpēm, tāpēc rezultāts ir precīzs un atgriezenisks – nekādas noapaļošanas vai krāsu gammas apgriešanas.
Turklāt šī lapa automātiski apstrādā trīs ciparu saīsinājumus – piemēram, #abc tiek pārvērsts par #aabbcc pirms konvertācijas. Visi krāsu lauki (HSL, HSV, CMYK, LAB) tiek atjaunināti vienlaikus, tāpēc jūs redzat pilnu krāsas aprakstu vairākos formātos.
HEX krāsu koda struktūra un noteikumi
Lai lapa strādātu pareizi, jums jāievēro daži vienkārši formāta nosacījumi.
Derīgie ievadi
- Sešu ciparu HEX – piemēram,
#4f46e5,1E90FF,#ffe4b5. Katrs cipars var būt no 0 līdz 9 vai no A līdz F (neatkarīgi no lielajiem vai mazajiem burtiem). - Trīs ciparu saīsinājums – piemēram,
#abc,#fff,#f00. Katrs cipars tiek dublēts, veidojot#aabbcc,#ffffff,#ff0000. - Bez
#– lapa pieņem arī tīru virkni, piemēram,4f46e5,abc.
Nederīgie ievadi
Ja ievadāt vērtību, kas neatbilst gaidītajam formātam, rīks parāda kļūdas ziņojumu:
"Enter a hex color like #4f46e5 or #abc."
Piemēram, astoņu ciparu kods (#4f46e5ff) tiks noraidīts, jo tajā ir alfa kanāls. Tāpat nederēs kodi ar ceturtdaļzīmēm vai nepareizu ciparu skaitu (piemēram, #1234 vai #xyz).
Automātiskā paplašināšana
Trīs ciparu saīsinājums ir tikai ērtības labad. Matemātiski #abc ir identisks #aabbcc. Ja jūs ievadīsiet #abc, lapa pirms konvertācijas automātiski to paplašinās uz #aabbcc. Tātad:
#abc→ R =aa(heksadecimāli), G =bb, B =cc#abcnav vienāds ar#abccccvai kādu citu kombināciju – tikai dublēšana.
Konvertācijas matemātika: no bāzes‑16 uz bāzi‑10
Laba daļa cilvēku zina, ka HEX‑to‑RGB ir vienkārša matemātika, bet ir vērts to izskaidrot ar konkrētiem piemēriem.
Vispārīga formula
Katrs divu hex ciparu pāris atbilst vienam krāsu kanālam. Pārvēršana notiek šādi:
decimālā vērtība = (pirmais cipars × 16) + (otrais cipars)
Piemēram, 4f:
4heksadecimāli = 4 decimālifheksadecimāli = 15 decimāli- Rezultāts:
(4 × 16) + 15 = 64 + 15 = 79
Tātad #4f46e5:
- Sarkanais:
4f→ 79 - Zaļais:
46→(4 × 16) + 6 = 64 + 6 = 70 - Zilais:
e5→(14 × 16) + 5 = 224 + 5 = 229
RGB vērtība: 79, 70, 229
Kāpēc noapaļošana nav vajadzīga?
Jo heksadecimālā sistēma ir precīza – katrs cipars ir 4 biti, divi cipari veido 8 bitus, kas ir tieši 0–255. Tā kā 16 ir 2⁴, pārvēršana no bāzes‑16 uz bāzi‑10 ir deterministiska un atgriezeniska. Nekādas daļskaitļu noapaļošanas nav, atšķirībā no konvertācijām starp dažādām krāsu telpām (piemēram, RGB uz CMYK).
Trīs ciparu saīsinājuma piemērs
#abc:
- Paplašina uz
#aabbcc - Sarkanais:
aa→(10 × 16) + 10 = 160 + 10 = 170 - Zaļais:
bb→(11 × 16) + 11 = 176 + 11 = 187 - Zilais:
cc→(12 × 16) + 12 = 192 + 12 = 204
RGB:170, 187, 204
RGB vērtību nozīme un pielietojums
RGB ir aditīvais krāsu modelis: sarkanā, zaļā un zilā gaisma tiek sajaukta, lai iegūtu jebkuru redzamo krāsu ekrānā. Katra kanāla vērtība 0 nozīmē, ka šīs gaismas nav; 255 nozīmē pilnu spilgtumu. Piemēram, rgb(255,0,0) ir tīri sarkans, rgb(255,255,0) ir dzeltens (sarkanais un zaļais sajaukti).
Izmantošana praksē
- CSS:
color: rgb(79, 70, 229);ir tiešs ekvivalentscolor: #4f46e5;. Abi tiek interpretēti vienādi, bet RGB ir ērtāks, ja vērtības jāapstrādā programmatiski – piemēram, JavaScript mainot atsevišķus kanālus. - Canvas un WebGL: Daudzās grafikas API ir nepieciešami decimāli skaitļi; HEX ir jāpārvērš.
- Dizaina programmas: Adobe Photoshop, Figma u.c. bieži atbalsta RGB slīdņus, un 0–255 vērtības ir intuitīvākas nekā hex pāri.
Krāsu telpas sinhronizācija
Šī lapa pēc ievades automātiski atjaunina visus pārējos krāsu formātus – HSL, HSV, CMYK, LAB. Tas ir noderīgi, ja jums ir nepieciešams, piemēram, HSL spilgtuma regulēšana vai CMYK vērtības drukāšanai. Visā lapā tiek izmantota reāllaika sinhronizācija, tāpēc izmaiņas vienā laukā uzreiz parādās citos.
Biežākās kļūdas un kā tās izvairīties
Lai gan konvertēšana ir matemātiski vienkārša, lietotāji bieži pieļauj formāta kļūdas.
1. Alfa kanāla iekļaušana
Astotoņu ciparu HEX, piemēram, #4f46e5ff, satur papildu kanālu – caurspīdīgumu (alfa). Šī lapa to neatbalsta. Ja nepieciešama RGB ar alfa, izmantojiet atsevišķu rīku. Šeit tiek apstrādāti tikai sešu vai trīs ciparu kodi bez alfa.
2. Nepareizs simbolu skaits
Piemēram, #1234 (četri cipari) vai #1234567 (septiņi cipari) nav derīgi. Lapa atpazīst tikai tieši 3 vai 6 hex ciparus (ieskaitot # vai bez tā). Arī #12345 (pieci) tiks noraidīts kā nepareizs.
3. Saīsinājuma pārpratumi
Daži lietotāji domā, ka #abc ir vienāds ar #a0b0c0 – tas ir nepareizi. Pareizā paplašināšana ir #aabbcc. Katrs saīsinājuma cipars tiek dublēts, nevis papildināts ar nullēm. Piemēram, #f00 dod #ff0000 (tīri sarkans, nevis #f00000 vai #f0000).
4. Jaukti lielie un mazie burti
Tas nav kļūda – lapa pieņem gan lielos, gan mazos burtus. #4F46E5 un #4f46e5 ir identiski. Tomēr, ja izmantojat saīsinājumu, pārliecinieties, ka visi cipari ir heksadecimāli (0–9, A–F). Burti G–Z nav derīgi.
FAQ (bieži uzdotie jautājumi)
Vai šī lapa var konvertēt krāsu, kurai ir caurspīdīgums?
Nē. Lapa apstrādā tikai sešu vai trīs ciparu HEX kodus bez alfa kanāla. Astotoņu ciparu kodi (piemēram, #4f46e5ff) netiek pieņemti. Ja nepieciešama RGB ar alfa, izmantojiet citu rīku.
Kāpēc RGB vērtības vienmēr ir veseli skaitļi?
Jo HEX kodi izsaka katru krāsu kanālu ar 8 bitiem (256 līmeņi). 8 biti var attēlot tikai veselus skaitļus no 0 līdz 255. Konvertācija no heksadecimālās uz decimālo sistēmu ir deterministiska, tāpēc noapaļošana nav nepieciešama.
Vai #fff ir derīgs ievads?
Jā, tas ir derīgs trīs ciparu saīsinājums. Lapa to automātiski paplašina uz #ffffff un pārvērš par RGB: 255, 255, 255 (balts).
Ko darīt, ja redzu kļūdas ziņojumu?
Pārbaudiet ievadīto vērtību: tai jābūt tieši 3 vai 6 heksadecimāliem cipariem (pirms # vai bez tā). Atcerieties, ka alfabētiskie simboli drīkst būt tikai A–F (vai a–f). Piemēram, #1G2B3C ir nederīgs, jo G nav heksadecimāls cipars.
Vai šī lapa saglabā manis ievadītās krāsas?
Nē. Visas konvertācijas tiek veiktas jūsu pārlūkā (client-side). Nekas netiek augšupielādēts vai glabāts serverī. Tāpēc varat droši izmantot konfidenciālus krāsu kodus.
Vai HSL vai CMYK vērtības tiek aprēķinātas reāllaikā?
Jā. Kad ievadāt HEX kodu, lapa uzreiz atjaunina visus krāsu laukus, ieskaitot HSL, HSV, CMYK un LAB. Tas ir noderīgi, ja nepieciešama krāsas analīze vairākās telpās vienlaicīgi.