Guhertoyê ji RGB bo HSL

Her rengê RGB bi HSL wêne bikin — bi demek û belaş

#9B59B6

Her nirxa rengê li vir paste bike — em forma bo te têdîtin.

R
G
B
Encama HSL
Tîpa reng (hue)
283°
Tevlikî (saturation)
39%
Ronahî
53%

Ev reng di hemû forman de

Profîla CMYK: Coated FOGRA39 (mîhengê bingehîn ê Photoshop ji bo Ewropayê)

RGB ekranê re dibêje çiqas ronahî bixire; HSL jî dibêje reng çawa dîtî ye. Guherandina sê kanal bo hue, saturation û lightness rengê bi destan zû tê guhertin.

Çawa guhertina ji RGB bo HSL dixebite

  1. R, G û B bi 255 ve biceribîne da ku her nirx di navbera 0 û 1 de bin.
  2. Mezintrîn û biçûktrîn ji wan sê bigire — navîn wan ronahî L e.
  3. Heger mezintrîn û biçûktrîn wekhev bin, reng gris e: hue û saturation herdu 0 in.
  4. Dîsa S ji vejîna navbera mezintrîn û biçûktrîn derxîne, û H ji kanalê ku herî mezin e xwendin.

Mînakî ku xebitî

RGB rgb(155, 89, 182)=HSL hsl(283, 39%, 53%)

Bi bingeh rast e. Lê ji ber ku H, S û L gelemperî wek hejmarên tevahî têne nîşandan, vegerandin dikare kanalek an du qadam biguherîne.

RGB û HSL vekirî

RGB çi ye?

RGB rengek wek sê kanalên ronahiyê tê dîyar kirin — sor, kesk û şîn — her yek ji 0 heta 255. Ew rifeya çawa ekranan rastî xebitînin nîşan dide: hemû sê bi 255 spî dikin, hemû bi 0 re reş. Heke tu divê bi hejmaran hesab bike, RGB bijarteke rast e, û rgba() jî serî transparansê zêde dike.

Sintaks:
rgb(R, G, B)
Range:
0–255 per channel
Baştirîn ji bo:
kod, canvas, transparans bi rgba()

HSL çi ye?

HSL rengek di sê beşan de dikeve: hue (0–360° li ser çarçoveya rengan), saturation (çawa rengdar, 0–100%) û lightness (çawa ronahî, 0–100%). Ji ber ku her beş wek awayê mirovan reng îzah dikin têkildar e, HSL hêsantirîn format e bo avakirinê tint, shade û paletên pêwist — bi dest an di kodê de.

Sintaks:
hsl(H, S%, L%)
Range:
0–360°, 0–100%, 0–100%
Baştirîn ji bo:
palet, tint û shade, theming

Tabela referansê ji RGB bo HSL

Renganên herî gelek di CSS de, guhertî ji RGB bo HSL.

RengRGBHSL
blackrgb(0, 0, 0)hsl(0, 0%, 0%)
whitergb(255, 255, 255)hsl(0, 0%, 100%)
redrgb(255, 0, 0)hsl(0, 100%, 50%)
limergb(0, 255, 0)hsl(120, 100%, 50%)
bluergb(0, 0, 255)hsl(240, 100%, 50%)
yellowrgb(255, 255, 0)hsl(60, 100%, 50%)
orangergb(255, 165, 0)hsl(39, 100%, 50%)
tealrgb(0, 128, 128)hsl(180, 100%, 25%)
purplergb(128, 0, 128)hsl(300, 100%, 25%)
grayrgb(128, 128, 128)hsl(0, 0%, 50%)

Pirsên pirr tê pirsîn

R, G û B bi 255 ve biceribîne da ku her nirx di navbera 0 û 1 de bin. Mezintrîn û biçûktrîn ji wan sê bigire — navîn wan ronahî L e. Heger mezintrîn û biçûktrîn wekhev bin, reng gris e: hue û saturation herdu 0 in. Dîsa S ji vejîna navbera mezintrîn û biçûktrîn derxîne, û H ji kanalê ku herî mezin e xwendin.

Bi bingeh rast e. Lê ji ber ku H, S û L gelemperî wek hejmarên tevahî têne nîşandan, vegerandin dikare kanalek an du qadam biguherîne.

HSL rengek di sê beşan de dikeve: hue (0–360° li ser çarçoveya rengan), saturation (çawa rengdar, 0–100%) û lightness (çawa ronahî, 0–100%). Ji ber ku her beş wek awayê mirovan reng îzah dikin têkildar e, HSL hêsantirîn format e bo avakirinê tint, shade û paletên pêwist — bi dest an di kodê de.

Erê. Bişkojka guhertinê li dijî qada têketinê te digihîje guherandina HSL bo RGB, ku tevî wisa xebitînin. Her du alî bi heman formula têne hesibandin, tenê bi rêya vegerandinê têne sepandin.

HSL diçêke ku tu hêwesa rengêkî girêdayî dixwazî ne rengêkî taybet: Hêjayî Hê (H) biguherîne bo aksentê pêwendîdar, S kêm bike bo variantekî tar, L zêde bike bo rewşa hover.