Convert the hexadecimal color in css to the rgb format.

Source: Internet
Author: User

Convert the hexadecimal color in css to the rgb format.

 

Function fromHex (color) {/* summary: Convert the css attribute value to an image in rgb format # fff-> 0 xfff length to 4. One character occupies one attribute, 0x10 = 16 (4 to the power of 2, that is, 4 after 1) = 1 0000, then an f is the 1111 placeholder for mask = 1111, used to occupy the last four bits (& used to retain the value of the last four bits). Other High bits are cleared. Each traversal starts from the last four bits, so the B value is obtained first, after the difficulty, move the four digits. After obtaining the g, move the four digits, and get the r, get the B attribute: 0000 1111 1111 1111 0000 & 0000 0000 1111 (only 16 digits are listed here, normally, 32-bit) 0000 0000 0000 1111 B is saved to the variable c 0000 1111 1111 1111> 4,-> 0000 0000 1111 1111 0000 get g attribute 000 0 1111 1111 & 0000 0000 0000 1111 0000 0000 0000 get the value of g, save it to variable c in four places, get the value of r ffffff-> 0 xffffff length is 8, each two characters represents a function 0xff = 1111 1111 each time the last eight digits are obtained, which exactly represents the color value */var t ={}, bits = (color. length = 4 )? 4: 8, // if it is shorthand, # fff, then bits is 4 bits, each representing an attribute, the other values are 8 bits, and each two bits represent an attribute # FFFF00 mask = (1 <bits)-1; // represents a byte placeholder, which shifts four or eight bits to the left, var a = (1 </4)-1-> 10000-1,. toString (2); // 1111, or 8-bit 1111 1111 color = Number (0x + color. substr (1); // # convert ff0000 to hexadecimal 0xff0000; if (isNaN (color) {return null; // Color} [B, g, r]. forEach (function (x) {var c = color & mask; color >>= bits; t [x] = bits = 4? 17 * c: c; // 0 xfff. An f should represent 255. It should be [0-255], divided by 15 equal portions, with an interval of 17. Therefore, the obtained value must be multiplied by 17 to represent the value of 255 in rgb}); t. a = 1; return t; // Color} console. log (fromHex (# 00f) // {r: 0, g: 0, B: 255, a: 1}

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.