User:Harthur/ColorConversion: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
Line 17: Line 17:
example:
example:
<pre>colorCommon.toHex("hsl(142, 45%, 10%)");</pre>
<pre>colorCommon.toHex("hsl(142, 45%, 10%)");</pre>


=== toRgb ===
=== toRgb ===
Line 29: Line 30:
example:
example:
<pre>colorCommon.toRgb("hsv(230, 100%, 10%)");</pre>
<pre>colorCommon.toRgb("hsv(230, 100%, 10%)");</pre>


=== toPercent ===
=== toPercent ===
Line 41: Line 43:
example:
example:
<pre>colorCommon.toRgb("#66CCE4");</pre>
<pre>colorCommon.toRgb("#66CCE4");</pre>


=== toHsl ===
=== toHsl ===
Line 53: Line 56:
example:
example:
<pre>colorCommon.toHsl("#66CCE4");</pre>
<pre>colorCommon.toHsl("#66CCE4");</pre>


=== toHsv ===
=== toHsv ===
Line 65: Line 69:
example:
example:
<pre>colorCommon.toHsv("#66CCE4");</pre>
<pre>colorCommon.toHsv("#66CCE4");</pre>


=== rgbValues ===
=== rgbValues ===
Line 77: Line 82:
example:
example:
<pre>colorCommon.rgbValues("#66CCE4")["red"];</pre>
<pre>colorCommon.rgbValues("#66CCE4")["red"];</pre>


=== hslValues ===
=== hslValues ===
Line 89: Line 95:
example:
example:
<pre>colorCommon.hslValues("#66CCE4")["light"];</pre>
<pre>colorCommon.hslValues("#66CCE4")["light"];</pre>


=== hsvValues ===
=== hsvValues ===
Line 101: Line 108:
example:
example:
<pre>colorCommon.hsvValues("#66CCE4")["satv"];</pre>
<pre>colorCommon.hsvValues("#66CCE4")["satv"];</pre>


=== isValid ===
=== isValid ===
Line 114: Line 122:
<pre>colorCommon.isValid("rgb(4000,,)");</pre>
<pre>colorCommon.isValid("rgb(4000,,)");</pre>


=== isValid ===
reports whether a color string is a valid color
parameter:
* any color string
return:
* <tt>true</tt> if it is a valid color, <tt>false</tt> otherwise
example:
<pre>colorCommon.isValid("rgb(4000,,)");</pre>


=== luminosity ===
=== luminosity ===

Revision as of 00:13, 14 September 2009

About

download: colorCommon.js

This is a javascript library for converting colors between different color formats. It supports rgb, hsl, and hsv. To call a method of the library simply say colorCommon.methodName(). Valid color strings can take one of the following formats: #00FF00, rgb(0, 255, 0), rgb(0%, 100%, 0%), hsl(120, 100%, 50%), hsv(120, 100%, 100%). If a non-valid color string is passed in an "InvalidColorValue" exception is thrown

API

toHex

gets a Hex string for a color

parameter:

  • any valid color string

return:

  • a string of the color in hex format

example:

colorCommon.toHex("hsl(142, 45%, 10%)");


toRgb

gets an Rgb string for a color

parameter:

  • any valid color string

return:

  • a string of the color in rgb format

example:

colorCommon.toRgb("hsv(230, 100%, 10%)");


toPercent

gets an Rgb string in percentile format for a color

parameter:

  • any valid color string

return:

  • a string of the color in rgb percentile format

example:

colorCommon.toRgb("#66CCE4");


toHsl

gets an hsl string for a color

parameter:

  • any valid color string

return:

  • a string of the color in hsl format

example:

colorCommon.toHsl("#66CCE4");


toHsv

gets an hsv string for a color

parameter:

  • any valid color string

return:

  • a string of the color in hsv format

example:

colorCommon.toHsv("#66CCE4");


rgbValues

gets the individual red, green, and blue values for a color string

parameter:

  • any valid color string

return:

  • an object with properties red, green, and blue

example:

colorCommon.rgbValues("#66CCE4")["red"];


hslValues

gets the individual hue, saturation, and lightness values for a color string

parameter:

  • any valid color string

return:

  • an object with properties hue, sat, and light

example:

colorCommon.hslValues("#66CCE4")["light"];


hsvValues

gets the individual hue, saturation, and value values for a color string

parameter:

  • any valid color string

return:

  • an object with properties hue, satv, and val

example:

colorCommon.hsvValues("#66CCE4")["satv"];


isValid

reports whether a color string is a valid color

parameter:

  • any color string

return:

  • true if it is a valid color, false otherwise

example:

colorCommon.isValid("rgb(4000,,)");


luminosity

gets the WCAG luminosity for a color.

parameter:

  • any valid color string

return:

  • a decimal number from 0 to 1 (0 is black, 1 is white)

example:

colorCommon.luminosity("#445590");


contrast

gets the WCAG luminosity contrast ratio for a color.

parameter:

  • any valid color string

return:

  • a decimal number from 0 to 21 (4.5 is considered minimum for text/background ratio, 7 is good, and 10+ is excellent)

example:

colorCommon.contrast("hsl(46, 100%, 34%)", "#445590");