Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Quiet Mono Release Log Block for Ark UI

A quiet release log of five single mono lines: an inverted version chip, a plain date, a sigil and a word for the kind of change, and the change itself, between hairlines.

Framework
UI library

Preview

Preview width

Installation

Part of Pro
Pro unlocks the code and one-line install of every Pro button and text effect, plus the MCP for your AI editor.
Have Pro already? Sign in to open it.Opens here as soon as you're Pro.

Overview

A quiet changelog for React with Ark UI, written for Quietterm, a fictional terminal emulator. A start-aligned header with a Full changelog link sits over five releases, each a single mono line between hairlines: the version as an inverted chip, the date as plain digits, the kind of change as a sigil and a word (+ new, ~ improved, ! fixed) and the change itself. There are no badges and no icons. The chip is inverted by structure (foreground fill, background text), so the block follows your theme in light and in dark. It's built from Guides and Button, with CSS transitions for the entrance and your theme's tokens for every colour. For terminals, CLIs and any product that wants its changelog as quiet as its interface. The releases are example data.

FAQ

Why is it called dark minimal if it follows the theme?

The slug keeps its URL. The look is quiet and typographic, with a high-contrast version chip, but no section is forced dark: in a light theme it's light, in a dark theme it's dark.

How are the kinds told apart without colour or icons?

Each line says the word (new, improved, fixed) after a sigil. The sigil is decoration and hidden from assistive technology; the word carries the meaning.

How do I change the lines?

Edit RELEASES at the top of the file, newest first: a version, an ISO date shown as it is, a kind and the change. Dates are fixed, never computed from today. Five lines is the limit; older ones belong behind the link.

How does it fit on a phone and in a right-to-left layout?

Below md each line stacks: the chip and the date on one row, the kind and the change under them. In a right-to-left layout the rows mirror; versions and dates stay left to right.

What moves?

The header and the list fade up once on load, with CSS transitions; with reduced motion they are off. The block has no state.