Theme: light is a dimmer brand-tinted stone with deeper shade, so it reads
as the same material as dark; every neutral now carries --nv-brand in both
appearances. Native controls (accent-color, caret-color) take the brand.
Time picker: 24-hour by default; data-nv-format-toggle adds a third wheel
of 24H / AM / PM. Swiping it rebuilds the hour wheel for the new format.
The selection lens is a raised glass bar, not a flat band.
Motion: drum effect on the wheels as a scroll-driven animation, with a
script fallback for engines without it (Firefox); rubber-band at both ends
of a wheel that springs back; calendar months slide locally instead of via
a page-wide transition; a chosen day springs into place.
Firefox: wheel notches arrive in lines, not pixels, which made the
rubber-band invisible; deltaMode is now normalised. The selected-day pop
no longer plays on page load.
Also: hover only inside @media (hover: hover) on the slider, the Glaze
inner glow is a token, and the focus note in GUIDELINES.md is corrected
(popovers do not trap focus). SPDX identifier added to niveus.js.
check.py, build.py and build.py --check pass.
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Glaze is glass with a dial: --nv-glass-frost (0 clear .. 1 heavy) moves
backdrop blur, tint and saturation together, read where the surface is
drawn so any subtree or slider can change it. A masked rim and a specular
bloom follow the pointer via niveus.js; without it the light sits at its
default and the material still reads. Falls back to the elevated solid
under reduced transparency or without backdrop-filter.
New components: .nv-slider (binds to a token with data-nv-var),
.nv-calendar, .nv-timepicker (24-hour by default, optional 24H / AM/PM
switch, value always HH:MM), and .nv-picker with .nv-menu--listbox (search,
type-ahead, keys). All render without niveus.js except where noted.
GUIDELINES.md is the normative rulebook for people and AI agents.
check.py, build.py and build.py --check pass.
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Tokens
- --nv-color-glow role (light and dark) and a glow scale: --nv-glow-sm/md/lg,
--nv-glow-blur-*, --nv-glow-spread-*, --nv-glow-strength
- --nv-stagger (0ms under reduced motion) and --nv-duration-shimmer
Components
- Card: --lit (lit top edge in --nv-card-tint), --glow, --spotlight
(light follows the pointer); light layers combine with every elevation
- Tile: small raised key for a glyph or product mark; --solid, --glow, sizes
- Avatar: raised disc with --ring / --glow, sizes, __status, avatar group
- Stat: readings set into one recessed well (.nv-stat-group)
- Steps: markers set into a rail; done steps light their stretch; vertical
- Deck: one surface in front of stacked layers of its kind
- Skeleton: recessed placeholder with a slow sweep, still under reduced motion
- Text: .nv-text-lit and .nv-text-lit--accent
Continuity
- .nv-reveal / .nv-reveal-group: content arrives once as it scrolls into view
(nv-arrive keyframe); niveus.js marks pending state, so nothing is hidden
without the script or under reduced motion
- niveus.js tracks the pointer for .nv-card--spotlight
README and REFERENCE document every new class, token and attribute;
tools/check.py passes and dist/ is rebuilt.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Niveus read flat: thin sheens, short shadows, opaque grey chrome and a
painted canvas. This retunes values and component internals only; every
class and token name is unchanged, so existing pages pick it up as is.
- Canvas: a faint accent light falls across the page, so translucent
layers have something to show through.
- Surfaces: the surface sheen runs the full height (lit top, shaded
foot); raised and filled sheens, highlights and bevels are stronger;
the elevation scale is deeper and softer.
- Translucency: cards, dialogs, the sidebar and tab tracks let some of
the canvas through, with blur so busy grounds never read as texture;
frosted and glass materials are clearer with more blur.
- Filled buttons give off a soft glow of their own color.
- Light fields are paper instead of grey wells that looked disabled.
- Fixes: navigation bars wrap and lists scroll inside them instead of
overflowing the page on phones; choice labels sit at control size;
disabled ghost buttons no longer grow a filled well; the color-swatch
rule is split so neither engine drops it.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_019iMUTHrD8K9CSuHqsanje9
It had been warmed together with the canvas by mistake; pressed surfaces
are meant to sit between hover and inset, as before.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Bevelled controls with light falling across them, fields as wells, solid
windows, and glass kept for the chrome that floats over everything else.
Warm graphite in dark, soft paper in light, one brand color driving both.
Ships its own fonts (Instrument Sans, JetBrains Mono; OFL).
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
