Scenic v0.10.2 Scenic.Primitive.Style.Paint.Color View Source

Fill a primitive with a single color

The color paint is used as the data for the :fill style.

Full Format

{:color, valid_color}

The full format is a tuple with two parameters. The first is the :color atom indicating that this is color paint data. The second is any valid color (see below).

Shortcut Format

valid_color

Because the color paint type is used so frequently, you can simply pass in any valid color and the :fill style will infer that it is to be used as paint.

Example:

graph
|> line({{0,0}, {100,100}}, fill: :blue)

Valid Colors

There are several ways to specify a color.

Named Colors

The simplest is to used a named color (see the table below). Named colors are simply referred to by an atom, which is their name. Named colors are opaque by default.

Named Colors with Alpha / Transparency

If you want a named color with a transparency, you can wrap it in a tuple and add a number between 0 and 255 (or 0x00 and 0xFF), to represent the alpha transparency.

{:blue, 128}

RGB Colors

An RGB color directly specifies the three color channels as a tuple. It is opaque by default.

{123, 231, 210}
{0xA1, 0xB1, 0xC1}

RGBA Colors

An RGBA color directly specifies the three color channels and the alpha/transparecy as a tuple.

{123, 231, 210, 128}
{0xA1, 0xB1, 0xC1, 0x12}

Named Colors

The set of named colors is adapted from the formal named colors from html.

NameValueExample
:alice_blue{0xF0, 0xF8, 0xFF}
 
:antique_white{0xFA, 0xEB, 0xD7}
 
:aqua{0x00, 0xFF, 0xFF}
 
:aquamarine{0x7F, 0xFF, 0xD4}
 
:azure{0xF0, 0xFF, 0xFF}
 
:beige{0xF5, 0xF5, 0xDC}
 
:bisque{0xFF, 0xE4, 0xC4}
 
:black{0x00, 0x00, 0x00}
 
:blanched_almond{0xFF, 0xEB, 0xCD}
 
:blue{0x00, 0x00, 0xFF}
 
:blue_violet{0x8A, 0x2B, 0xE2}
 
:brown{0xA5, 0x2A, 0x2A}
 
:burly_wood{0xDE, 0xB8, 0x87}
 
:cadet_blue{0x5F, 0x9E, 0xA0}
 
:chartreuse{0x7F, 0xFF, 0x00}
 
:chocolate{0xD2, 0x69, 0x1E}
 
:coral{0xFF, 0x7F, 0x50}
 
:cornflower_blue{0x64, 0x95, 0xED}
 
:cornsilk{0xFF, 0xF8, 0xDC}
 
:crimson{0xDC, 0x14, 0x3C}
 
:cyan{0x00, 0xFF, 0xFF}
 
:dark_blue{0x00, 0x00, 0x8B}
 
:dark_cyan{0x00, 0x8B, 0x8B}
 
:dark_golden_rod{0xB8, 0x86, 0x0B}
 
:dark_gray{0xA9, 0xA9, 0xA9}
 
:dark_grey{0xA9, 0xA9, 0xA9}
 
:dark_green{0x00, 0x64, 0x00}
 
:dark_khaki{0xBD, 0xB7, 0x6B}
 
:dark_magenta{0x8B, 0x00, 0x8B}
 
:dark_olive_green{0x55, 0x6B, 0x2F}
 
:dark_orange{0xFF, 0x8C, 0x00}
 
:dark_orchid{0x99, 0x32, 0xCC}
 
:dark_red{0x8B, 0x00, 0x00}
 
:dark_salmon{0xE9, 0x96, 0x7A}
 
:dark_sea_green{0x8F, 0xBC, 0x8F}
 
:dark_slate_blue{0x48, 0x3D, 0x8B}
 
:dark_slate_gray{0x2F, 0x4F, 0x4F}
 
:dark_slate_grey{0x2F, 0x4F, 0x4F}
 
:dark_turquoise{0x00, 0xCE, 0xD1}
 
:dark_violet{0x94, 0x00, 0xD3}
 
:deep_pink{0xFF, 0x14, 0x93}
 
:deep_sky_blue{0x00, 0xBF, 0xFF}
 
:dim_gray{0x69, 0x69, 0x69}
 
:dim_grey{0x69, 0x69, 0x69}
 
:dodger_blue{0x1E, 0x90, 0xFF}
 
:fire_brick{0xB2, 0x22, 0x22}
 
:floral_white{0xFF, 0xFA, 0xF0}
 
:forest_green{0x22, 0x8B, 0x22}
 
:fuchsia{0xFF, 0x00, 0xFF}
 
:gainsboro{0xDC, 0xDC, 0xDC}
 
:ghost_white{0xF8, 0xF8, 0xFF}
 
:gold{0xFF, 0xD7, 0x00}
 
:golden_rod{0xDA, 0xA5, 0x20}
 
:gray{0x80, 0x80, 0x80}
 
:grey{0x80, 0x80, 0x80}
 
:green{0x00, 0x80, 0x00}
 
:green_yellow{0xAD, 0xFF, 0x2F}
 
:honey_dew{0xF0, 0xFF, 0xF0}
 
:hot_pink{0xFF, 0x69, 0xB4}
 
:indian_red{0xCD, 0x5C, 0x5C}
 
:indigo{0x4B, 0x00, 0x82}
 
:ivory{0xFF, 0xFF, 0xF0}
 
:khaki{0xF0, 0xE6, 0x8C}
 
:lavender{0xE6, 0xE6, 0xFA}
 
:lavender_blush{0xFF, 0xF0, 0xF5}
 
:lawn_green{0x7C, 0xFC, 0x00}
 
:lemon_chiffon{0xFF, 0xFA, 0xCD}
 
:light_blue{0xAD, 0xD8, 0xE6}
 
:light_coral{0xF0, 0x80, 0x80}
 
:light_cyan{0xE0, 0xFF, 0xFF}
 
:light_golden_rod_yellow{0xFA, 0xFA, 0xD2}
 
:light_gray{0xD3, 0xD3, 0xD3}
 
:light_grey{0xD3, 0xD3, 0xD3}
 
:light_green{0x90, 0xEE, 0x90}
 
:light_pink{0xFF, 0xB6, 0xC1}
 
:light_salmon{0xFF, 0xA0, 0x7A}
 
:light_sea_green{0x20, 0xB2, 0xAA}
 
:light_sky_blue{0x87, 0xCE, 0xFA}
 
:light_slate_gray{0x77, 0x88, 0x99}
 
:light_slate_grey{0x77, 0x88, 0x99}
 
:light_steel_blue{0xB0, 0xC4, 0xDE}
 
:light_yellow{0xFF, 0xFF, 0xE0}
 
:lime{0x00, 0xFF, 0x00}
 
:lime_green{0x32, 0xCD, 0x32}
 
:linen{0xFA, 0xF0, 0xE6}
 
:magenta{0xFF, 0x00, 0xFF}
 
:maroon{0x80, 0x00, 0x00}
 
:medium_aqua_marine{0x66, 0xCD, 0xAA}
 
:medium_blue{0x00, 0x00, 0xCD}
 
:medium_orchid{0xBA, 0x55, 0xD3}
 
:medium_purple{0x93, 0x70, 0xDB}
 
:medium_sea_green{0x3C, 0xB3, 0x71}
 
:medium_slate_blue{0x7B, 0x68, 0xEE}
 
:medium_spring_green{0x00, 0xFA, 0x9A}
 
:medium_turquoise{0x48, 0xD1, 0xCC}
 
:medium_violet_red{0xC7, 0x15, 0x85}
 
:midnight_blue{0x19, 0x19, 0x70}
 
:mint_cream{0xF5, 0xFF, 0xFA}
 
:misty_rose{0xFF, 0xE4, 0xE1}
 
:moccasin{0xFF, 0xE4, 0xB5}
 
:navajo_white{0xFF, 0xDE, 0xAD}
 
:navy{0x00, 0x00, 0x80}
 
:old_lace{0xFD, 0xF5, 0xE6}
 
:olive{0x80, 0x80, 0x00}
 
:olive_drab{0x6B, 0x8E, 0x23}
 
:orange{0xFF, 0xA5, 0x00}
 
:orange_red{0xFF, 0x45, 0x00}
 
:orchid{0xDA, 0x70, 0xD6}
 
:pale_golden_rod{0xEE, 0xE8, 0xAA}
 
:pale_green{0x98, 0xFB, 0x98}
 
:pale_turquoise{0xAF, 0xEE, 0xEE}
 
:pale_violet_red{0xDB, 0x70, 0x93}
 
:papaya_whip{0xFF, 0xEF, 0xD5}
 
:peach_puff{0xFF, 0xDA, 0xB9}
 
:peru{0xCD, 0x85, 0x3F}
 
:pink{0xFF, 0xC0, 0xCB}
 
:plum{0xDD, 0xA0, 0xDD}
 
:powder_blue{0xB0, 0xE0, 0xE6}
 
:purple{0x80, 0x00, 0x80}
 
:rebecca_purple{0x66, 0x33, 0x99}
 
:red{0xFF, 0x00, 0x00}
 
:rosy_brown{0xBC, 0x8F, 0x8F}
 
:royal_blue{0x41, 0x69, 0xE1}
 
:saddle_brown{0x8B, 0x45, 0x13}
 
:salmon{0xFA, 0x80, 0x72}
 
:sandy_brown{0xF4, 0xA4, 0x60}
 
:sea_green{0x2E, 0x8B, 0x57}
 
:sea_shell{0xFF, 0xF5, 0xEE}
 
:sienna{0xA0, 0x52, 0x2D}
 
:silver{0xC0, 0xC0, 0xC0}
 
:sky_blue{0x87, 0xCE, 0xEB}
 
:slate_blue{0x6A, 0x5A, 0xCD}
 
:slate_gray{0x70, 0x80, 0x90}
 
:slate_grey{0x70, 0x80, 0x90}
 
:snow{0xFF, 0xFA, 0xFA}
 
:spring_green{0x00, 0xFF, 0x7F}
 
:steel_blue{0x46, 0x82, 0xB4}
 
:tan{0xD2, 0xB4, 0x8C}
 
:teal{0x00, 0x80, 0x80}
 
:thistle{0xD8, 0xBF, 0xD8}
 
:tomato{0xFF, 0x63, 0x47}
 
:turquoise{0x40, 0xE0, 0xD0}
 
:violet{0xEE, 0x82, 0xEE}
 
:wheat{0xF5, 0xDE, 0xB3}
 
:white{0xFF, 0xFF, 0xFF}
 
:white_smoke{0xF5, 0xF5, 0xF5}
 
:yellow{0xFF, 0xFF, 0x00}
 
:yellow_green{0x9A, 0xCD, 0x32}
 

Additional Named Colors

NameValueExample
:clear{0x80, 0x80, 0x80, 0x00}
:transparent{0x80, 0x80, 0x80, 0x00}

Link to this section Summary

Functions

Convert a named color to RGB format

Convert a named or RGB color to RGBA format

Verify that a color is correctly described

Link to this section Types

Link to this type

rgb() View Source
rgb() :: {r :: number(), g :: number(), b :: number()}

Link to this type

rgba() View Source
rgba() :: {r :: number(), g :: number(), b :: number(), a :: number()}

Link to this type

t() View Source
t() :: atom() | {name :: atom(), a :: number()} | rgb() | rgba()

Link to this section Functions

Link to this function

name_to_rgb(name) View Source
name_to_rgb(name :: atom()) :: rgb()

Convert a named color to RGB format

Link to this function

to_rgba(color) View Source
to_rgba(color :: t()) :: rgba()

Convert a named or RGB color to RGBA format

Verify that a color is correctly described