Timeless

Components baked on the modern web platform, for a post-framework era.

Coming soon GitHub

Modern ingredients

Built with the browser features Timeless is meant to preserve, not replace.

CSS anchor positioning

Popover surfaces can stay attached without framework layout code.

Native Overlays

Native dialogs and popovers handle light dismiss and escape flows.

Invoker Commands

A new way to define declarative behavior for UI components.

Container queries

Components can respond to the space they actually receive.

light-dark()

Color tokens can honor color-scheme without extra runtime.

Light DOM

Consumers keep readable markup and style-relevant anatomy, intended for zero layout shifts.

House rules

Timeless treats the platform as the recipe: HTML renders, CSS carries the look, native browser features do the heavy lifting, and custom elements step in only to improve behavior, accessibility, and authoring across stacks.

HTML-first, CSS-first, Accessibility-first.
Renderable before JavaScript runs.
Native controls before custom replacements.
Custom elements enhance behavior and accessibility.
Plain attributes for public component APIs.
Optional CSS, layered and override-friendly.
Side-effect-free imports; explicit define entrypoints.
No third-party dependencies or rendering runtimes.

Bakes before JavaScript

The initial shell works with HTML and CSS. JavaScript enhances only when available.

Recipe: Popover

Starts with: A native button and hidden content.
Adds: Popover wiring, ARIA state, focus behavior, and anchored positioning.
Falls back to: An inert button before JavaScript runs.

<ui-popover>
  <button type="button" data-ui-trigger>
    Menu
  </button>
  <ui-popover-content hidden>
    The content
  </ui-popover-content>
</ui-popover>

Served with StoryLite

Preview components, explore variants, and read documentation in the same plain-web spirit.

Email address