.colorCard
  margin-top 2u
  width 17u
  align-items center

  &Demo
    width 17u
    height 10u
    box-shadow 1px 1px 3px rgba(0,0,0,.24)

    &White
      background-color $UI.colors.white
    &Dark
      background-color $UI.colors.dark
    &Primary
      background-color $UI.colors.primary
    &Success
      background-color $UI.colors.success
    &Warning
      background-color $UI.colors.warning
    &Error
      background-color $UI.colors.error

  &Hex
    background-color #eaeaec
    padding 1u
    margin-top 1u
    width 10u
    text-align center

  &Variable
    margin-top 1u