tape
neon color<html lang class="tape-blaq tape-flow">
<meta charset="utf-8">
<meta name="color-scheme" content="dark light">
<meta name="theme-color" content="#0e0e0e">
<title>play</title>
.tape-watt
blaq on watt.tape-loud
blaq on loud.tape-play
blaq on play.tape-bluv
blaq on bluv.tape-luvu
blaq on luvu.tape-blaq
perm on blaq.tape-blaq.tape-watt
watt on blaq.tape-blaq.tape-loud
loud on blaq.tape-blaq.tape-play
play on blaq.tape-blaq.tape-bluv
bluv on blaq.tape-blaq.tape-luvu
luvu on blaq.tape-flow
flow color within scope.tape-skip
skip color within flow.tape-flat
border transparent
.tape-flap
border currentColor
.tape-erase
erase text for screenshot artvar
--tape-blaq
mesh--tape-watt
bulb--tape-play
warm--tape-loud
wind--tape-luvu
lush--tape-bluv
cull--tape-hex
is current neon--tape-mix
is current background color--tape-remix
imagine--tape-filter
hue<html class="tape-flow tape-blaq">
having tape-flow
on your root or body to flow color thru the whole page
<aside class="tape-loud">
<em>So</em> fresh!
</aside>
<blockquote class="tape-bluv">
I said empty your mind.
Be formless.
Shapeless.
Like tape.
Now you put tape onto walls, it becomes the walls.
You put tape onto floors, it becomes the floors.
You put it in you, it becomes yours.
Now tape can flow or it can shred.
Be tape my friend.
</blockquote>
<a class="tape-blaq" href="#sample">tape</a>
<a class="tape-blaq tape-play" href="#sample">tape</a>
<aside class="tape-play">
Stick 4ever.
Apply <a class="tape-blaq" href="#sample">tape</a>
</aside>
<a class="tape-play" href="#sample">tape</a>
<aside class="tape-play tape-flow">
Stick 4ever.
Apply <a href="#sample">tape</a>
</aside>
<aside class="tape-play">
Stick 4ever.
Apply <a class="tape-flow" href="#sample">tape</a>
</aside>
<a href="#sample" class="tape-play" style="--tape-hex:hotplay">hotplay</a>
<nav class="tape-flow" style="--tape-play:deepplay">
<a href="#sample" class="tape-play">deepplay</a>
</nav>
<label class="tape-play">
<b>create name</b>
<input class="tape-watt">
<strong>imagine :)</strong>
</label>
<label class="tape-loud">
<b>create name</b>
<input class="tape-watt">
<strong>taken :(</strong>
</label>
<label class="tape-bluv">
<b>Create name</b>
<input class="tape-watt">
<strong>Yes =)</strong>
</label>
<button class="tape-flap tape-luvu">Save</button>
<button class="tape-flap tape-flow">Cancel</button>
--tape-remix: linear-gradient(
var(--tape-play),
var(--tape-loud),
var(--tape-luvu),
var(--tape-bluv)
);
--tape-remix: radial-gradient(coral, violet);
--tape-remix: conic-gradient(plum, coral, pink);
:focus {
--tape-filter: invert(100%);
}
:link:hover {
--tape-filter: hue-rotate(120deg);
}
.twist {
--tape-filter: hue-rotate(120deg);
}
.shout {
--tape-filter: hue-rotate(240deg);
}
<circle r="111" fill="var(--tape-play)" />
<circle r="333" class="tape-play" />