Color Name Class (SVG 1.0 – X11 and VGA)

UPDATE (2009-05-17):
  1. Renamed class from Color to ColorName
  2. Changed package to yourpalmark
  3. hexValue property has been renamed to color
  4. Added a toString method to trace out the properties of the ColorName object
  5. Changed license from New BSD to MIT

One small thing I’ve always found a bit handy with CSS in XHTML is the ability to type familiar names for colors rather than the hex value.

Unfortunately, Flash’s StyleSheet does not support color names at all and Flex’s StyleManager only supports the 16 basic VGA color names.

I decided to write a class that adds static properties for all of the color names defined by SVG 1.0 (The colors in SVG 1.0 include the X11 colors with the addition of gray/grey variants. X11 includes the 16 basic VGA, or HTML4, colors as well). This class also adds two static convenience methods for returning a ColorName object by passing in the color name or hexadecimal color value.

While this class does not extend the CSS parsing capabilities of Flash, it could be used by an advanced StyleSheet class that overwrites the parseCSS method using this class as a lookup.
This class could also be extended to add (or overwrite) color values specific to a project you are working on. By setting up static properties for a project color set, the project team could be assured that the colors being used are consistent between team members.

Description:
The ColorName class defines the names and hexadecimal values of the colors defined in SVG 1.0.

Documentation:
ColorName Class Documentation

Download ColorName Class

About the author

Mark

View all posts

10 Comments

  • Finally I will be able to simply write “majesticunicornwhite” and flash will know what I am talking about. Thank you Mark Walters. I owe you one million thanks. If only you had a link to unicornpaypal.com I could donate to your magnificence. Stay strong my flash brother.

  • Hi Mark,

    This looks pretty handy. Can you provide an example of how to use it?

    I’ve tried the following code but I get an error …

    package
    {
    import flash.display.MovieClip;
    import flash.display.Sprite;

    import com.yourpalmark.utils.ColorName;

    public class Main extends MovieClip
    {
    private var canvas:Sprite;

    public function Main():void
    {
    canvas = new Sprite();
    canvas.graphics.beginFill(BLUE, 1);
    canvas.graphics.drawRect(0, 0, 500, 250);
    canvas.graphics.endFill();
    addChild(canvas);
    }
    }
    }

  • Hi Mark,

    I think I have figured out how to use this class and have managed to get it to work with colours that use a name without underscores. Like this …

    import com.yourpalmark.utils.ColorName;
    var canvas:Sprite;
    canvas = new Sprite();
    canvas.graphics.beginFill(ColorName.getColorNameByName(“LAVENDER”).color, 1);
    canvas.graphics.drawRect(0, 0, 550, 400);
    canvas.graphics.endFill();
    addChild(canvas);

    But when I try to get a colour that has underscores in it’s name like this …

    import com.yourpalmark.utils.ColorName;
    var canvas:Sprite;
    canvas = new Sprite();
    canvas.graphics.beginFill(ColorName.getColorNameByName(“LAVENDER_BLUSH”).color, 1);
    canvas.graphics.drawRect(0, 0, 550, 400);
    canvas.graphics.endFill();
    addChild(canvas);

    I get the following error message …

    “TypeError: Error #1009: Cannot access a property or method of a null object reference. at colorNameDemo_fla::MainTimeline/frame1()”

    Any ideas why this is?

    Any help would be gratefully appreciated.

    Cheers,

    Adrian

  • Hey Adrian,
    Sorry for the really late reply…
    You do not need to instantiate the class, all of the properties and methods are static.
    Each color in the class is an instance of the ColorName class. So, BLUE, for example, has a color and name property.
    To use a color, you would just need to say ColorName.BLUE.color.
    You don’t actually need to use the getColorNameByName() method. If you do use the method, there’s a reason that it doesn’t work for the colors with an underscore.
    The name of LAVENDER_BLUSH is actually “lavenderBlush”. You can find that out by tracing out ColorName.LAVENDER_BLUSH.name.
    But again, the easiest way to get the color would just be to say ColorName.LAVENDER_BLUSH.color.
    Hope that helps!!

  • Hi Mark,

    I just though I’d check back here and was happy to see your reply from February. Thought I’d let you know that thanks to your reply I got it to work. If anyone else is interested here is my demo code …

    package
    {
    import flash.display.Sprite;
    import com.yourpalmark.utils.ColorName;

    public class Main extends Sprite
    {
    private var canvas:Sprite;

    public function Main():void
    {
    canvas = new Sprite();
    canvas.graphics.beginFill(ColorName.LAVENDER_BLUSH.color, 1);
    canvas.graphics.drawRect(0, 0, 500, 250);
    canvas.graphics.endFill();
    addChild(canvas);
    }

    }

    }

Leave a Reply

Your email address will not be published. Required fields are marked *