LCARS Color Guide

Each color block below includes the HTML color code and CSS class name

The following are all the colors used in the various LCARS themes. Some themes share colors with other themes. Class names can be used to change the background color of buttons as well as some block elements. For example: The default button color is No. 15, bluey. Let's say you have a row of buttons and you want to add some color. Simply add the class name of the color you want in the HTML 'a' tag, <a class="african-violet" href="url">My Button</a>. Please note, however, that the class names for font colors are different. Simply add 'go-' to the color name to change the color of text. For example: <p class="go-gold">Some gold text.</p> Result: Some gold text.

LCARS Classic Theme

• 01

  #f5f6fa
  space-white

• 02

  #ddbbff
  violet-creme

• 03

  #33cc99
  green

• 04

  #cc4499
  magenta

• 05

  #4455ff
  blue

• 06

  #ffcc33
  yellow

• 07

  #9944ff
  violet

• 08

  #ff7700
  orange

• 09

  #cc88ff
  african-violet

• 10

  text
  #cc77ff

• 11

  #dd4444
  red

• 12

  #ffaa90
  almond

• 13

  #ffbbaa
  almond-creme

• 14

  #ffcc66
  sunflower

• 15

  #7788ff
  bluey

• 16

  #666688
  gray

• 17

  #aaaaff
  sky

• 18

  #88ccff
  ice

• 19

  #ffaa00
  gold

• 20

  #ff2200
  mars

• 21

  #ff8866
  peach

• 22

  #ff9966
  butterscotch

• 23

  #ff5555
  tomato

• 24

  #cc33ff
  lilac

• 24

  links
  cc33ff

Nemesis Blue Theme

• 25

  #2255ff
  evening

• 26

  #1111ee
  midnight

• 27

  #88bbff
  ghost

• 27

  links & headings
  #88bbff

• 28

  #ccaa88
  wheat

• 29

  #cc6666
  roseblush

• 30

  #ffcc99
  honey

• 31

  #cc2233
  cardinal

• 32

  #ff7744
  pumpkinshade

• 33

  #ff8833
  tangerine

• 34

  #99dd66
  martian

• 35

  text
  #2266ff

• 36

  #ccdeff
  moonbeam

• 37

  #5588ff
  cool

• 38

  #444a77
  galaxy

• 39

  #ddeeff
  moonshine

Lower Decks Theme

• 40

  #ff4400
  october-sunset

• 40

  text
  #ff4400

• 41

  #ffaa44
  harvestgold

• 08

  #ff7700
  orange

• 30

  #ffcc99
  honey

• 30

  links & headings
  #ffcc99

• 42

  #ffeecc
  butter

Lower Decks PADD Theme

By the time I created the Lower Decks PADD theme I changed how I named the colors. Instead of trying to think up names for each color, I used a numbering system for the CSS class name, e.g. c43. I wished I had done this from the beginning as it would have saved me a lot of time coming up with names for every color (although I am particularly proud of "pumpkinshade" and "moonshine").

• 43

  #5588ee
  c43

• 44

  #88ffff
  c44

• 45

  #344466
  c45

• 46

  #455577
  c46

• 47

  #7799cc
  c47

• 48

  #66ccff
  c48

• 49

  #99ccff
  c49

• 50

  #ff3500
  c50

TNG Legacy Series

• 19

  #ffaa00
  gold

• 51

  #552255
  c51

• 52

  #663366
  c52

• 53

  #774477
  c53

• 54

  #885588
  c54

• 55

  #996699
  c55

• 56

  #ff8800
  c56

• 57

  #d0b0a0
  c57

• 58

  #bbbbff
  c58

• 59

  #99aa66
  c59

• 60

  #00bb00
  c60

• 61

  #33ff33
  c61

• 62

  #ddffdd
  c62

• 63

  #ffebde
  c63

• 64

  #cc99cc
  c64

• 65

  #f6eef6
  c65