Nature Portfolio

• Name:

  color-white

  Type:

  literal

  Value:

  #fff

  Will effect:

  background-page

• Name:

  color-black

  Type:

  literal

  Value:

  #000

• Name:

  color-greyscale-100

  Type:

  literal

  Value:

  #eeeeee

  Will effect:

  palette-default-greyscale-100

• Name:

  color-greyscale-200

  Type:

  literal

  Value:

  #f8f8f8

• Name:

  color-greyscale-300

  Type:

  literal

  Value:

  #f3f3f3

• Name:

  color-greyscale-400

  Type:

  literal

  Value:

  #dadada

• Name:

  color-greyscale-500

  Type:

  literal

  Value:

  #d5d5d5

  Will effect:

  palette-default-greyscale-500

• Name:

  color-greyscale-600

  Type:

  literal

  Value:

  #666

• Name:

  color-greyscale-700

  Type:

  literal

  Value:

  #555

• Name:

  color-greyscale-800

  Type:

  literal

  Value:

  #222

• Name:

  color-blue-100

  Type:

  literal

  Value:

  #ebf6ff

  Will effect:

  palette-default-blue-lightest

• Name:

  color-blue-200

  Type:

  literal

  Value:

  #f0f7fc

• Name:

  color-blue-300

  Type:

  literal

  Value:

  #C5E0F4

• Name:

  color-blue-400

  Type:

  literal

  Value:

  #0088CC

• Name:

  color-blue-500

  Type:

  literal

  Value:

  #069

• Name:

  color-blue-600

  Type:

  literal

  Value:

  #004b83

• Name:

  color-blue-700

  Type:

  literal

  Value:

  #025E8D

• Name:

  color-blue-900

  Type:

  literal

  Value:

  #01324B

• Name:

  color-orange-400

  Type:

  literal

  Value:

  #F58220

• Name:

  color-orange-500

  Type:

  literal

  Value:

  #C75301

• Name:

  color-orange-900

  Type:

  literal

  Value:

  #b74616

• Name:

  color-green-400

  Type:

  literal

  Value:

  #00A69D

• Name:

  color-green-500

  Type:

  literal

  Value:

  #007373

• Name:

  color-yellow-500

  Type:

  literal

  Value:

  #fece3e

  Will effect:

  palette-interaction-focus

• Name:

  color-purple-500

  Type:

  literal

  Value:

  #785BA7

• Name:

  color-red-300

  Type:

  literal

  Value:

  #f15a40

• Name:

  color-red-400

  Type:

  literal

  Value:

  #ff0000

• Name:

  color-red-500

  Type:

  literal

  Value:

  #ed1C24

• Name:

  color-red-800

  Type:

  literal

  Value:

  #940720

• Name:

  color-greymetal-300

  Type:

  literal

  Value:

  #c2c9d6

  Will effect:

  illustration-background-003

• Name:

  color-greymetal-500

  Type:

  literal

  Value:

  #536179

  Will effect:

  illustration-background-002

• Name:

  color-greymetal-800

  Type:

  literal

  Value:

  #29303C

  Will effect:

  illustration-background-001

• Name:

  background-page

  Type:

  alias

  Effected by:

  color-white

• Name:

  illustration-background-001

  Type:

  alias

  Effected by:

  color-greymetal-800

• Name:

  illustration-background-002

  Type:

  alias

  Effected by:

  color-greymetal-500

• Name:

  illustration-background-003

  Type:

  alias

  Effected by:

  color-greymetal-300

• Name:

  palette-interaction-focus

  Type:

  alias

  Effected by:

  color-yellow-500

  Will effect:

  state-focus

• Name:

  palette-default-greyscale-100

  Type:

  alias

  Effected by:

  color-greyscale-100

• Name:

  palette-default-greyscale-500

  Type:

  alias

  Effected by:

  color-greyscale-500

• Name:

  palette-default-blue-lightest

  Type:

  alias

  Effected by:

  color-blue-100

• Name:

  state-focus

  Type:

  alias

  Effected by:

  palette-interaction-focus