Skip to content

Defining Colors

Francesco edited this page Jul 20, 2017 · 18 revisions

t-ui supports colors in hexadecimal representations ("#aarrggbb") and several strings.


Hexadecimal

#aarrggbb
or
#rrggbb

  • the character # is needed: if you don't include it, you will notice unexpected behaviors
  • aa represents the alpha channel, the transparency. It's optional, so you can exclude it if you don't need transparency. "00" means "completely transparent", "FF" means "fully opaque". So, "80" means "~50% transparent"
  • rr represents the red color
  • gg represents the green color
  • bb represents the blue color

Examples

  • #FFC107 #FFC107
  • #795548 #795548
  • #607D8B #607D8B
  • #3F51B5 #3F51B5
  • #E040FB #E040FB

Fully transparent color:

  • #00000000 (but every color with alpha "00" is ok)

Fully opaque color

  • #FFrrggbb (replace rrggbb with the desired color)

Nice Sites:

  • Official Google Material Palette: Link
  • An other Material Palette: Link
  • Many other Colors: Link

String

You can use those strings that represent simplified colors:

  • #FF0000 red
  • #0000FF blue
  • #00FF00 green
  • #000000 black
  • #FFFFFF white
  • #888888 gray
  • #00FFFF cyan
  • #FF00FF magenta
  • #FFFF00 yellow
  • #CCCCCC lightgray
  • #444444 darkgray
  • #00FFFF aqua
  • #FF00FF fuchsia
  • #00FF00 lime
  • #800000 maroon
  • #000080 navy
  • #808000 olive
  • #800080 purple
  • #C0C0C0 silver
  • #008080 teal