@s9a/bae

SF bae CSS color palette

Usage no npm install needed!

<script type="module">
  import s9aBae from 'https://cdn.skypack.dev/@s9a/bae';
</script>

README

bae

welcome
to
our
bae

palette

  • .bae-warm is #415 on #bae
  • .bae-cool is #bae on #415
  • .bae-dawn is #510 on #bae
  • .bae-dusk is #bae on #510
  • .bae-vine is #707 on #4ea
  • .bae-vein is #4ea on #707
  • .bae-swag is #925 on #bff
  • .bae-swab is #bff on #925
  • .bae-gold is #707 on gold
  • .bae-rush is gold on #707

behavior

Remember to style interactive elements with visual affordance. Link underline etc.

  • .bae-clean Override coloring within
  • .bae-unclean Override .bae-clean on specific element
  • .bae-flat Transparentize borders within
  • .bae-unflat Override .bae-flat on specific element

examples

page

<html class="bae-warm bae-clean">

anywhere

<aside class="bae-cool">
  <em>hella</em> cool
</aside>

setup