Skip to content
Get Started
Architecture / Depth

Kinetic Actuators

Global Tier
0.75

Precision depth simulation through tonal luminosity shifts. We utilize oklch-based color tiers to create structural hierarchy without the use of additive lines or borders.

00

Surface Lowest

#000000

LUM 0.00%
01

Surface Low

#111410

LUM 6.25%
02

Surface Container

#171b16

LUM 8.40%
03

Surface High

#1c211b

LUM 10.15%
04

Surface Highest

#212720

LUM 12.80%

Kinetic Glass

Experimental

Utilizing 12px backdrop blur with 70% container opacity to simulate physical layered materials.

terminal System Variables
--vl-surface-high #1c211b
--vl-elevation-delta 0.021l
--vl-kinetic-blur 40px
--vl-ambient-alpha 0.05
bolt

Actuator Ready

Kinetic feedback enabled

Component Actuators

Showcase

Control States

Data Ingress

Ambient Shadows Visualization

TIER 01
TIER 02
TIER 03
<!-- Kinetic card: viewport entrance + hover feedback -->
<article
  vl-effect="hover-card-stack"
  vl-timeline="view"
  vl-range="entry">
  <div class="glass-panel">...</div>
</article>

Elevation variables (--vl-elevation-delta, --vl-ambient-alpha) are consumed automatically by the actuator system.