– Common Function Library Project


Last updated May 9, 2009


Scott Lingle

Version: 0 | Requires: CF5 | Library: StrLib

This takes a background color in HEX and returns an appropriate color value (light or dark) to use as a text color. Uses an algorithm from a draft W3C document on accessibility.

Return Values:
returns a string


<cfoutput><p style="background-color: ##000033;"><span style="color: #getForegroundColor('##000033')#;">Text Color!</span></p></cfoutput>


Name Description Required
backgroundHEX string containing HEX color Yes

Full UDF Source:

 Determines a light or dark text color based on the given background color.
 @param backgroundHEX 	 string containing HEX color (Required)
 @return returns a string 
 @author Scott Lingle ( 
 @version 0, May 9, 2009 
<cffunction name="getForegroundColor" output="false" access="private" returntype="string" hint="gets the appropriate FG color.">
    <cfargument name="backgroundHEX" required="true" />
        // clean up the incoming color, strip the pound sign.
        var cleanHex = Replace(arguments.backgroundHEX,"##","");
        // break the hex up and convert to RGB
        var R = InputBaseN(Mid(cleanHex, 1, 2),16);
        var G = InputBaseN(Mid(cleanHex, 3, 2),16);        
        var B = InputBaseN(Mid(cleanHex, 5, 2),16);
        //determine the backgrounds 'brightness' (from a W3C Accessibility draft)
        var brightness = ((R * 299) + (G * 587) + (B * 114)) / 1000;
        //determine if it is a light or dark background and set the return to either black or white.
        if(255 - brightness lt 128) {
            return "##000000";
        } else {
            return "##ffffff";
blog comments powered by Disqus


Latest Additions

Kevin Cotton added
May 5, 2016

Raymond Camden added
April 25, 2016

Chris Wigginton added
January 18, 2016

Gary Stanton added
November 19, 2015

Sebastiaan Naafs - van Dijk added
November 13, 2015

Created by Raymond Camden / Design by Justin Johnson