Skip to content

summer style

Compare
Choose a tag to compare
@ryanve ryanve released this 06 Aug 20:12
· 17 commits to master since this release

depend via npm or unpkg

or stay fresh with tag style

style embed is optimal because local is stable and embedding prevents FOUC color

<style media=(color) data-help="https://s9a.page/dew" data-tag="v0.1.0">
.dew-shift,.dew-shift *{transition:var(--dew-shift)}.dew-wet,.dew-wet *{background:var(--dew-oil);color:var(--dew-ink)}.dew-rim,.dew-rim *{border-color:var(--dew-rim)}.dew-hyper,.dew-hyper :any-link{filter:var(--dew-hyper)}.dew-tab :focus,.dew-tab:focus{filter:var(--dew-focus);outline-color:var(--dew-locus)}.dew-field:disabled{filter:var(--dew-vapor)}.dew-lunar.dew-lunar,.dew-media.dew-media,.dew-polar.dew-polar,.dew-solar.dew-solar{fill:var(--dew-oil);background:var(--dew-oil);color:var(--dew-ink)}:root{--dew-hyper:none;--dew-media:var(--dew-solar);--dew-polar:var(--dew-lunar);--dew-oil:var(--dew-media);--dew-ink:var(--dew-polar);--dew-rim:var(--dew-ink);--dew-shift:none;--dew-solar:mistyrose;--dew-lunar:darkviolet;--dew-locus:currentColor;--dew-focus:invert(100%);--dew-hover:none;--dew-vapor:opacity(60%)}:any-link:hover{--dew-hyper:var(--dew-hover)}:any-link:focus{--dew-hyper:var(--dew-focus)}.dew-lunar,.dew-polar{--dew-oil:var(--dew-polar);--dew-ink:var(--dew-media)}@media (prefers-color-scheme:dark){:root{--dew-media:var(--dew-lunar);--dew-polar:var(--dew-solar)}}
</style>

your local style flavor would cascade

<link rel="stylesheet" href="diy.css">

choose your future

choose dew.