Math Related : Hex-to-RGB Conversion

Alexei Kourbatov Dec 19, 2008

General

Use this script to convert a hex color string to numeric RGB values of the same color. Great for matching colors. Easy to implement!

Notes

Created by: Alexei Kourbatov
Web Site: Linuxtopia

Source Code

Paste this source code into the designated areas.

Head

Paste this code into the HEAD section of your HTML document.


R = HexToR("#FFFFFF");
G = HexToG("#FFFFFF");
B = HexToB("#FFFFFF");

function HexToR(h) { return parseInt((cutHex(h)).substring(0,2),16) }
function HexToG(h) { return parseInt((cutHex(h)).substring(2,4),16) }
function HexToB(h) { return parseInt((cutHex(h)).substring(4,6),16) }
function cutHex(h) { return (h.charAt(0)=="#") ? h.substring(1,7) : h}

Body

Paste this code into the BODY section of your HTML document


<form name=rgb>
<input type=text name=hex size=8 value="FFFFFF">
<input type=button name=btn value="Convert to RGB"
onCLick="this.form.r.value=HexToR(this.form.hex.value);
this.form.g.value=HexToG(this.form.hex.value);
this.form.b.value=HexToB(this.form.hex.value);">
<br>
R:<input type=text name=r size=3>
G:<input type=text name=g size=3>
B:<input type=text name=b size=3>
</form>

Leave a Response

(1 comment)

Many people are using short hex colors, where fff is the same as ffffff, 222 is the same as 22222, etc. This converter could be modified to also convert short hex by checking the hex string length and branching to two routines. It would also be nice to validate the input.

Phil Frisbie Dec 19, 2008

Alphabetical Listing

Tutorials

Ajax Tutorials

Ajax

Buttons

Cookies

CSS

Forms

Games

Generators

Image Effects

Math Related

Miscellaneous

Multimedia

Navigation

Page Details

Password

Snippets

Text Effects

Time & Date

User Details