Skip to content

Swiss Tech MonoMotion

Dimension

A CAD dimension line over (or under) an inline target: a 1 px ink line with end ticks across the child's width and a mono label on it, drawing in from the left after the heading's entrance.

Live, interactive React component · light themeResponsive

About the Swiss Tech Mono Dimension

A CAD dimension line over (or under) an inline target: a 1 px ink line with end ticks across the child's width and a mono label on it, drawing in from the left after the heading's entrance. The child stays plain readable text; the line is aria-hidden. Use it once, over the hero's highlighted word (or the 404 code). Client component.

It is part of Swiss Tech Mono. The style’s 92 pieces share one set of tokens, type and motion, in a light and a dark theme, so whatever you take from it fits together.

To put it in your project, copy the prompt into Claude Code, OpenAI Codex or Cursor, or add the file and its styles by hand. The documentation walks through both.

See it on a full page

The pieces that sit beside this one in the same style.

All 45 in Motion & Effects