Frequently Referenced Types

Color

There is no color type in Ignition; colors are simply strings which are formatted in one of the following ways.

Input Type	Description	Examples	Sample Color
Color Picker	~~Coming~~All ~~soon,~~color ~~this~~properties ~~will~~may beuse ~~filled~~the ~~out~~ignition ~~when~~designer itcolor picker to select colors. The value is ~~added.~~translated from rgb and hsl to hex as the user edits the color picker values.	See hex code input type.	N/A
Hex code	Colors may be entered as a six-digit hexadecimal RGB code. Each pair of values represents red, blue, and green, in that order.	`#FFFFFF` `#FF0000` `#00FF00` `#FFC0CB`	~~White~~white ~~Red~~red ~~Green~~green ~~Pink~~pink
RGB	Colors may be entered as RGB values, with three values for red, blue, and green, in that order.	`rgb(255, 255, 255)` `rgb(255, 0, 0)` `rgb(0, 255, 0)` `rgb(255, 192, 203)`	~~White~~white ~~Red~~red ~~Green~~green ~~Pink~~pink
RGBA	Colors may be entered as RGBA values, with three values for red, blue, and green, in that order, in addition to an alpha value that controls transparency.	`rgba(255, 255, 255, 1)` `rgba(255, 0, 0, 1)` `rgba(0, 255, 0, 1)` `rgba(255, 192, 203, 1)`	~~White~~white ~~Red~~red ~~Green~~green ~~Pink~~pink
HSL	Colors may be entered as HSL values, specifying hue, saturation, and lightness.	`hsl(0, 100, 100)` `hsl(0, 100, 50)` `hsl(120, 100, 50)` `hsl(310, 100, 50)`	~~White~~white ~~Red~~red ~~Green~~green ~~Pink~~pink
HSLA	Colors may be entered as HSLA values, specifying hue, saturation, and lightness, in addition to an alpha value that controls transparency.	`hsla(0, 100, 100, 1)` `hsla(0, 100, 50, 1)` `hsla(120, 100, 50, 1)` `hsla(310, 100, 50, 1)`	~~White~~white ~~Red~~red ~~Green~~green ~~Pink~~pink
Color String	A supported color may be written as a simple String. See Color Strings for examples of all supported colors.	`white` `red` `green` `pink`	~~White~~white ~~Red~~red ~~Green~~green ~~Pink~~pink
Ignition Color String	Ignition provides a set of themed colors that may be referenced as a string. These colors will change depending on the selected theme. See the Ignition User Manual for an exhaustive list.	`--neutral-10` `--seq-1` `--neutral-100` `--seq-6`	N/A

Sample Color Strings

Color names and hex values are not case-sensitive.

Sample Red Color Strings

Color	String	Hex Code	RGB	HSL
	`white`	`#FFFFFF`	`rgb(255, 255, 255)`	`hsl(0, 0, 100)`
	`red`	`#FF0000`	`rgb(255, 0, 0)`	`hsl(0, 100, 50)`
	`lightCoralgreen`	`#F08080`	`rgb(240, 128, 128)`	`hsl(0,79,72)`
	`salmon`	`#FA8072#00FF00`	`rgb(250,0, 128,255, 114)0)`	`hsl(6,120, 93,100, 71)50)`
	`darkSalmonpink`	`#FFC0CB`	`#E9967Argb(255, 192, 203)`	`rgb(233, 150, 122)`	`hsl(15, 72, 70)`
	`lightSalmon`	`#FFA07A`	`rgb(255, 160, 122)`	`hsl(17,350, 100, 74)88)`
	`crimson`	`#DC143C`	`rgb(220, 20, 60)`	`hsl(348, 83, 47)`
	`fireBrick`	`#B22222`	`rgb(178, 34, 34)`	`hsl(0, 68, 42)`
	`darkRed`	`#8B0000`	`rgb(139, 0, 0)`	`hsl(0, 100, 27)`

Back to top