Nature Portfolio

• Name:

  color-white

  Type:

  literal

  Value:

  #fff

• 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-200

  Type:

  literal

  Value:

  #FFEFDF

• Name:

  color-orange-300

  Type:

  literal

  Value:

  #ffe0bf

• Name:

  color-orange-400

  Type:

  literal

  Value:

  #F58220

• Name:

  color-orange-500

  Type:

  literal

  Value:

  #C75301

• Name:

  color-orange-700

  Type:

  literal

  Value:

  #c04300

• Name:

  color-orange-900

  Type:

  literal

  Value:

  #b74616

• Name:

  color-green-200

  Type:

  literal

  Value:

  #E4F5E6

• Name:

  color-green-300

  Type:

  literal

  Value:

  #cdedd1

• Name:

  color-green-400

  Type:

  literal

  Value:

  #00A69D

• Name:

  color-green-500

  Type:

  literal

  Value:

  #007373

• Name:

  color-green-700

  Type:

  literal

  Value:

  #007A4B

• Name:

  color-yellow-500

  Type:

  literal

  Value:

  #fece3e

  Will effect:

  state-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-cerulean-200

  Type:

  literal

  Value:

  #e0f5fa

• Name:

  color-cerulean-300

  Type:

  literal

  Value:

  #c1ecf6

• Name:

  color-cerulean-700

  Type:

  literal

  Value:

  #17758c

• Name:

  color-goldenrod-200

  Type:

  literal

  Value:

  #faf1dc

• Name:

  color-goldenrod-300

  Type:

  literal

  Value:

  #f4e3b8

• Name:

  color-goldenrod-400

  Type:

  literal

  Value:

  #daa520

• Name:

  color-goldenrod-700

  Type:

  literal

  Value:

  #905e14

• Name:

  color-gunmetal-200

  Type:

  literal

  Value:

  #f3f4f7

  Will effect:

  brand-color-pale

• Name:

  color-gunmetal-300

  Type:

  literal

  Value:

  #dbdfe6

  Will effect:

  brand-color-subtle

  illustration-background-003

• Name:

  color-gunmetal-400

  Type:

  literal

  Value:

  #6d7e9c

  Will effect:

  brand-color-accent

• Name:

  color-gunmetal-600

  Type:

  literal

  Value:

  #536179

  Will effect:

  illustration-background-002

• Name:

  color-gunmetal-700

  Type:

  literal

  Value:

  #424d61

  Will effect:

  brand-color-default

• Name:

  color-gunmetal-800

  Type:

  literal

  Value:

  #29303c

  Will effect:

  brand-color-strong

  illustration-background-001

• Name:

  brand-color-default

  Type:

  alias

  Effected by:

  color-gunmetal-700

• Name:

  brand-color-strong

  Type:

  alias

  Effected by:

  color-gunmetal-800

• Name:

  brand-color-accent

  Type:

  alias

  Effected by:

  color-gunmetal-400

• Name:

  brand-color-subtle

  Type:

  alias

  Effected by:

  color-gunmetal-300

• Name:

  brand-color-pale

  Type:

  alias

  Effected by:

  color-gunmetal-200

• Name:

  illustration-background-001

  Type:

  alias

  Effected by:

  color-gunmetal-800

• Name:

  illustration-background-002

  Type:

  alias

  Effected by:

  color-gunmetal-600

• Name:

  illustration-background-003

  Type:

  alias

  Effected by:

  color-gunmetal-300

• 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:

  color-yellow-500