RGB നിങ്ങളുടെ കൈയിൽ 0–255 വരെ ഉള്ള മൂന്ന് ദശലക്ഷ്യ ചാനലുകൾ നൽകുന്നു. HEX-ലേക്ക് മാറ്റം ഓരോ ചാനലും രണ്ട്-അങ്കി ഹെക്സഡെസിമൽ നമ്പറായി മാറ്റി, മുഴുവൻ കളർ ഒരു സംക്ഷിപ്ത ടോക്കണിൽ ഫിറ്റ് ചെയ്യുന്നതിനും എല്ലാ ബ്രൗസറുകളും design tool-കളും സ്റ്റൈൽ ഗൈഡുകളും തിരിച്ചറിയുന്നതിനും സഹായിക്കുന്നു.
RGB നിന്ന് HEX വരെ മാറ്റം എങ്ങനെ നടക്കുന്നു
- ചുവപ്പ് ചാനൽ എടുക്കി അത് 16-ൽ 部ിഭജിക്കുക: ഭാഗാഫലം ആദ്യ അക്കമാണ്, ശേഷിക്കുഴവ് രണ്ടാം അക്കമാണ്.
- 10 മുതൽ 15 വരെയുള്ള അക്കങ്ങളെ A മുതൽ F വരെ അക്ഷരങ്ങളായി എഴുതുക — 255 FF ആകും.
- അർദ്ധനമാകുന്നില്ലാത്ത പച്ചയും നീലയും ആവർത്തിക്കുക; ഒറ്റ അക്കങ്ങൾ മുന്നിൽ 0 ചേർത്ത് പൂരിപ്പിക്കുക: 5 → 05.
- മൂന്ന് ജോഡികൾ ചേർത്ത് മുന്പ് ഒരു # വയ്ക്കുക.
പ്രായോഗിക ഉദാഹരണം
സൂക്ഷ്മമായി, ചാനലുകൾ 0 മുതൽ 255 വരെ മുഴുവൻ സംഖ്യകൾ ആണെങ്കിൽ. ഭാഗിക മൂല്യങ്ങൾ പോലൊരു RGB(79.5, 70, 229) ആദ്യം ഏറ്റവും نزدിക്ക് ഉള്ള മുഴുവൻ സംഖ്യയിലേക്ക് വലയം ചെയ്യപ്പെടും, കാരണം HEX ഇടക്കിടക്ക് സൂക്ഷിക്കാൻ കഴിയുന്നില്ല.
RGBയും HEXയും വിശദീകരിച്ചത്
RGB എന്താണ്?
RGB ഒരു കളർ മൂന്ന് ലൈറ്റ് ചാനലുകളായി വിവരിക്കുന്നു — red, green, blue — ഓരോത് 0–255 വരെയാണ്. ഇത് സ്ക്രീനുകൾ എങ്ങനെ പ്രവർത്തിക്കുന്നു എന്നതിനെ പ്രതിഫലിപ്പിക്കുന്നു: മൂന്നു ചാനലുകളും 255 ആയാൽ വെള്ള, എല്ലാ ചാനലുകളും 0 ആണെങ്കിൽ കറുപ്പ്. കളറുമായി കണക്കുകൾ ചെയ്യേണ്ടപ്പോഴെല്ലാം RGB അനുയോജ്യമാണ്, rgba() വഴി transparency ചേർക്കാനും കഴിയും.
- Syntax:
- rgb(R, G, B)
- Range:
- ഒരു ചാനലിന് 0–255
- Best for:
- code, canvas, rgba() ഉപയോഗിച്ച് transparency
HEX എന്താണ്?
HEX കോഡ് ആറ്-ടിജിറ്റുള്ള ഹെക്സാഡെസിമൽ നമ്പർ ആണ്, മുന്നിൽ # ഉം കൂടിയുള്ളത്, ഒരോ കളറിന്റെ റെഡ്, ഗ്രീൻ, ബ്ലൂ ചാനലുകൾ സംഭരിക്കുന്നു. ഓരോ ഡിജിറ്റുകളുടെ ജോഡിയും ഒരു ചാനൽ കവർ ചെയ്യുന്നു, 00 (യാതും ഇല്ല) മുതൽ FF (പൂർണ്ണം) വരെ, ഇത് RGB ന് സമാനമായ 16.7 മില്യൺ നിറങ്ങൾ ഒരു ചെറുതായുള്ള നോട്ടേഷനിൽ നൽകുന്നു. HEX ആണ് CSS, design tools, ബ്രാൻഡ് ഗൈڈر്ലൈൻസിൽ ഡീഫോൾട്ട്.
- Syntax:
- #RRGGBB
- Range:
- ഒരു ചാനലിന് 00–FF
- Best for:
- CSS, design handoff, brand guidelines
RGB to HEX reference table
സാധാരണയായി ഉപയോഗിക്കുന്ന CSS നിറങ്ങൾ RGB ൽ നിന്ന് HEX ആയി പരിവർത്തനം ചെയ്തിരിക്കുന്നു.
| നിറം | RGB | HEX |
|---|---|---|
| black | rgb(0, 0, 0) | #000000 |
| white | rgb(255, 255, 255) | #FFFFFF |
| red | rgb(255, 0, 0) | #FF0000 |
| lime | rgb(0, 255, 0) | #00FF00 |
| blue | rgb(0, 0, 255) | #0000FF |
| yellow | rgb(255, 255, 0) | #FFFF00 |
| orange | rgb(255, 165, 0) | #FFA500 |
| teal | rgb(0, 128, 128) | #008080 |
| purple | rgb(128, 0, 128) | #800080 |
| gray | rgb(128, 128, 128) | #808080 |