Changelog

Every change to what ships is listed here: tokens, components, registry items and the rules on this site. Each release opens with its breaking changes and what to do about them. The migration guide walks through the upgrade step by step.

Unreleased

Changes merged since v2.0.2, released with the next version.

Added

• Six slide layouts in the External deck template: four steps with an example, a problem with its evidence, three equal results, seven points and their impact, the layer diagram beside three benefits, and two theses.
• Two deck figures: access, each agent getting only its scoped view of one record with what it was refused, and schema, sources resolved to one coded fact each. Both build in, with a GIF for a deck presented live.
• Two deck figures: fanout, the Context Engine feeding the reader's own workflows, and pipeline, the engine end to end from sources to an agent. Both build in, with a GIF for a deck presented live. Connectors in deck figures are now curves, wiring included.
• A deck figure, answer: the same question put to an agent without and with the Context Engine, side by side, with the context each had and the sources the answer cites. It builds in, and the clinia-deck-figures export gives it a GIF for a deck presented live.
• The LinkedIn company, LinkedIn personal and social media banners carry the descriptor "Patient Context for Healthcare AI". Download them again from Social media.
• One-pagers, a page under Document conventions: when to send a one-pager instead of a deck, what makes a good one, and who approves it. Sales one-pagers are single US Letter PDFs built from this site's type, colours and line art by the clinia-one-pagers skill in the repository. See One-pagers.
• Fifteen utility icons for the Console: home, group, person-add, credit-card, cloud-off, school, redeem, speed, stacks, code, smart-toy, done-all, block, verified-user and report. Reinstall @clinia/icons. See Iconography.
• Documents, a page under Document conventions: the Clinia document template in Google Docs, which pages a document has, the rules that make it good, and the clinia-docs skill, which builds a document from the template or brings an older one onto it without adding content. See Documents.
• Presentations, a page under Document conventions: three deck templates in Google Slides (External, Client, and Internal), which deck needs marketing's approval, how to make one by hand or with Claude, and the frame and building blocks every slide uses, shown on the template's own slides. See Presentations.
• Scene: source records (SceneSource, the source plan node), an ambient dot field (SceneField, the plan's field) and a larger display card with the name in the serif (display), for a scattered-record scene: one patient's data as each source wrote it, before it is linked. See Scenes.
• Patient personas, a page under Marketing conventions: eight fictional patients, including the five clinia.com shows, each with a fixed name, date of birth and approved photo, used the same way in scenes, deck figures and post images. A scene card takes one with "avatar": "avatar:<slug>".

Changed

• The clinia-decks skill runs a storyline pass on the outline and again on the built deck. It fails a deck whose titles, read alone, don't tell the argument, whose parts don't answer the question the part before raised, whose numbers or names disagree between slides, that has no closing slide with the ask, or whose slides carry two claims or a claim with no source in the notes. The report goes out with the deck. See Presentations.
• Presentations adds a rule, readable by everyone. The deck check in the clinia-decks skill now also reviews layout and accessibility before a deck is handed back.
• The product is the Clinia Context Engine, described as "Patient Context for Healthcare AI". The press boilerplate on Brand exposure and the clinia-writing and clinia-one-pagers skills drop "for Health AI" from the product name, and clinia-writing flags the old line.
• The clinia-one-pagers skill can be downloaded for Claude Desktop: it writes a one-pager's copy as a plan, rendered to PDF in the repository. See One-pagers.
• A Document conventions group in the sidebar holds Presentations, Documents and One-pagers, under /docs/documents/. The old addresses redirect.
• Presentations: decks end on the closing slide, pick the slide made for their number of points, keep the approved compliance titles and lines, and never show a placeholder slide. The clinia-decks check now flags topic titles, titles out of line with the rest of the deck, reworded compliance text and slides left half empty, flags headings side by side that wrap differently and labels that wrap, and the skill has a customer-facing cloud marketplace recipe.
• The clinia-design-system skill reads DESIGN.md live instead of keeping its own summary, and hands decks, documents and code to clinia-decks, clinia-docs and clinia-ui. Download it from Using AI tools.
• The clinia-decks skill can be downloaded for Claude Desktop, and the clinia-writing download now matches the skill in the repository. See Presentations.
• Section headings on every docs page are links to themselves: click one, or copy it, to share a link to that section.
• Brand exposure links the help centre, now live at help.clinia.com, and the new status page at status.clinia.dev, which replaces cliniastatus.com.
• The HIPAA, GDPR, SOC 2 and PIPEDA badges on Security & compliance are SVG files, so they stay sharp at any size, and the download includes them. The old PNG links redirect to the SVGs.
• Help and support sites use base-sera with App conventions. The migration prompt on Using AI tools and the clinia-ui skill name it.
• Using AI tools links Clinia UI, Clinia's design system in Claude Design: the 2.0.2 tokens, fonts and logos, and all 118 components with Luma and Sera side by side, each with its page's rules and a live preview. See Using AI tools.

Fixed

• The deck check in the clinia-decks skill reads a space set as its own text run, so a title such as "Global security & compliance" no longer reads as "security &compliance".
• The deck check in the clinia-decks skill no longer fails a meeting agenda's title for naming the meeting, or a mono label broken onto several lines on purpose.

v2.0.2

Patch release with @clinia/tailwindcss 2.0.2 on npm latest and GitHub Packages. The tokens are unchanged from 2.0.1; the fixes and rules below ship with the site and the registry.

Added

• Twenty utility icons: layers, scan-delete and trending-down for Concord; rocket-launch, database, shield, key, troubleshoot, support-agent, list and arrow-right-alt for the help centre; and play-arrow, science, lock, light-mode, dark-mode, arrow-downward, flag, pause and not-equal for the CCE benchmark dashboard. Reinstall @clinia/icons. See Iconography.
• Charts, a Draft page under App conventions: gauge, radar, range plot, bullet, trend line, ranked bars, sparkbars and heatmap examples, with guidance on status marks, hand-built SVG charts, band opacity, entry motion and when a gauge beats a stat. See Charts.
• Logo Strip takes still, which holds the logos still, as under reduced motion, whatever the user's motion setting. A still row that overflows also scrolls with a mouse drag. Reinstall @clinia/logo-strip. See Logo Strip.
• The Button, Card and Item pages preview the Sera version and its states beside Luma's, so a marketing reviewer sees what a marketing site installs. See Button.
• Field, Select, Tooltip, Table, Code Block and Command pages show the states their rules depend on: the invalid field with its error, an open Select list, open tooltips, resting, hover and selected rows, the Code Block copy button, and the Command no-results state. See Select.

Changed

• Icon modules inline their Rounded 300 SVG, so @clinia/icons no longer installs @material-symbols-svg/react, and a client route ships one weight per icon instead of sixteen (check drops from 2.9 kB to 0.6 kB minified). The props and the rendered <svg> are the same. Reinstall @clinia/icons, then remove @material-symbols-svg/react from your dependencies. @clinia/eslint now flags any import of it, or of @material-symbols/svg-300, outside the icon generator. See Iconography.
• The registry items are MIT, like @clinia/tailwindcss. The repository's LICENSE carries the notices for the shadcn/ui, Material Symbols and Carbon code they include, and keeps the Clinia name, logo and brand assets out of the grant. See the LICENSE.
• Marketing getting started warns that Sera's uppercase controls widen labels and show user input in capitals, and links full-width sections in Containers. See Marketing getting started.
• Item: the Sera ItemTitle is an uppercase label for a few words. See Item.
• Rive scenes drops the "Home: start building" agency scene, which never played its typewriter. The generated rebuild still plays under the prompt example. See Rive scenes.

Fixed

• Logo Strip keeps its logos on one line under reduced motion. A row wider than the strip scrolls sideways and, only then, takes keyboard focus as a region named like the list. Its scrollbar stays clear until the pointer is over the row or it has focus. Reinstall @clinia/logo-strip. See Logo Strip.
• Cookie Consent passes eslint-config-next 16's React Compiler rules (react-hooks/refs, react-hooks/set-state-in-effect) with no disables, and no longer leaves an empty dialog from vanilla-cookieconsent in the accessibility tree. Reinstall @clinia/cookie-consent. See Cookie Consent.
• Command no longer leaves an empty listbox when a search matches nothing: the input reports collapsed and screen readers announce the no-results text. Reinstall @clinia/command. See Command.
• Alert takes role="note" for a static note in content, so screen readers read it in place instead of announcing it on load. See Alert.
• EmptyTitle takes render, so render={<h2 />} makes it a heading. Reinstall @clinia/empty. See Empty.
• Table: while a table is wider than its container, the scroll container is a tab stop and a region named by the table's aria-label or its TableCaption, so keyboard users can scroll it. Reinstall @clinia/table. See Table.
• A long ItemTitle truncates to one line with an ellipsis in Luma and Sera. A title that holds an icon or a badge now lays out inline; add flex items-center gap-2 through className to space them, which turns the clamp off. Reinstall @clinia/item. See Item.
• Code Block's copy button drops its shadow, in product and marketing. Code Block and File Upload keep one file for both styles. Reinstall @clinia/code-block. See Code Block.
• Typography says that 17 to 19px sizes move down to body-m, as its table shows. See Typography.
• Migration step 3 says GitHub Packages carries @clinia/tailwindcss from 2.0.1, and drops the npm tarball workaround. See Migration.

v2.0.1

Patch release with @clinia/tailwindcss 2.0.1 on npm latest and GitHub Packages. The tokens are unchanged from 2.0.0; the release brings v2 to GitHub Packages, and the fixes and rules below ship with the site and the registry.

Added

• Marketing Forms: how contact, demo and newsletter forms ask, validate and confirm on a marketing site, with the Sera fields, Button for the submit, the privacy line and unticked consent. See Forms.
• Card takes render, in Luma and Sera, so a card can render as an <article> or as its own link. See Card.
• Scenes can show provider data. New parts: the panel, a titled box of rows, and fields on the card. A plan can set its layout width and each box its w, and a line can meet a panel at one of its rows. A scene without pills has no emphasized entity, and chips can also stand for the systems that receive data. Reinstall @clinia/scene. See Scenes.
• A sharing image for each Clinia site's home page: the light Article card with the site's name as the eyebrow, for ui.clinia.dev, docs.clinia.com, help.clinia.com (English and French) and Concord. ui.clinia.dev now sets its own. See Sharing images.

Changed

• Marketing (Sera) form fields now match the forms on clinia.com: Input, Textarea, Select, Native Select, Combobox, Input Group and Input OTP are boxed controls with an input border and 8px corners instead of an underline, with a 16px value, and Field sets its label above the control in 16px sentence case. Focus takes the ring border and halo. Reinstall these components on a marketing site. See Field.
• Migration covers marketing sites: a table of marketing patterns and their Clinia components in step 11, the compliance badges in step 10, npm commands beside the pnpm ones, the tarball fallback when @clinia maps to GitHub Packages, and layering a site's own CSS so it doesn't beat the components. The migration prompt audits the same, plus dead CSS, swatches used outside a token, analytics, and the cookie banner. See Migration.
• Typography: display headlines carry no emphasis on a single word, since NaN Serf B has no italic or bold. See Typography.
• Colour: a swatch with no semantic token or brand-* utility, such as Peach-4, is for charts and illustrations only. See Colour.
• Logo and Favicon: a named Clinia product site uses the product lockup, with no "powered by Clinia" line, and Clinia's favicon. See Logo.
• Marketing motion: SVG animated with SMIL is out, since reduced motion can't stop it. See Motion.
• Brand Background: a hero with no Rive scene can take a blurred band, cropped away from the copy, and then drops its line accent. See Brand Background.
• SEO: with Vercel Analytics, start the window.va queue before tracking an event on page load, or the event is dropped. See SEO.
• Site header: a transparent home header needs the hero to run up under it. Marketing getting started links Site header for the scroll behaviour. See Site header.
• Cookie Consent replaces @clinia/web-cookiebot: Migration step 6 says how to move, and users keep their choice through the shared cc_cookie. See Cookie Consent.
• Logo Strip drops its Pause button. The loop still pauses on hover and off screen, and stops under reduced motion. Reinstall @clinia/logo-strip. See Logo Strip.

Fixed

• The theme and theme-marketing items install @clinia/tailwindcss@^2. With no version, a project that maps @clinia to GitHub Packages got 0.3.0 without a warning. See Migration.
• CTA takes an href, and a CTA with an href or a render link such as <Link href> renders a plain link. Screen readers announce it as a link, not a button, and Space no longer follows it. Drop nativeButton={false}. See CTA.
• Scene: a card with fields no longer calls a hook on one branch only, and a scene hidden by CSS waits until it shows to place its lines, instead of drawing them at NaN. Reinstall @clinia/scene. See Scene.
• Marketing (Sera) Input Group pads its addons like Luma, so an icon or a button inside the boxed field no longer touches its border. Reinstall @clinia/input-group on a marketing site. See Input Group.

v2.0.0

Design system v2, released on October 21, 2026, with @clinia/tailwindcss 2.0.0 on npm latest. Every entry below compares with v1.0.0.

Breaking

• Trust replaces Vital as the accent. --accent, --sidebar-accent and --ring move from Vital #ff5c00 to Trust #95795c. Trust is a 3:1 colour: borders, icons, selected states and text from 24px up, never label-size text or a fill behind it. Any component that puts small text on accent fails WCAG AA after the upgrade. Vital leaves product UI and the chart palette. See Colour.
• NaN Serf B replaces Gothia Serif as the display face, Book 400 only. Self-hosted apps swap the font files. See Typography.
• --input becomes a boundary colour: #8c8c8c light, #777777 dark, so field edges clear 3:1.
• The Sera and Luma CSS shape layers are removed. Shape now comes from the shadcn style in components.json: base-luma for product, base-sera for marketing.
• Utility icons move to Material Symbols, Rounded, weight 300, one module per icon in @clinia/icons. See Iconography.
• Table rows hover only when they're interactive. A row of static data no longer tints on hover. Set interactive on a TableRow that opens, selects or links to something, and it takes the bg-foreground/4 hover tint. TableHeader and TableFooter sit on bg-foreground/3. Reinstall @clinia/table, then add interactive to clickable rows and drop any hover:bg-transparent you added to static ones. See Table.

Added

• Every component also ships in a Sera version for marketing sites, with the same colour fixes and icons. Point @clinia at https://ui.clinia.dev/r/{style}/{name}.json and the style in components.json picks Luma or Sera. The old /r/{name}.json URL keeps serving Luma.
• New components: app shell, form and data components, File Upload, date and time pickers, Code Block and Logo. New variants: emphasis and interactive Card, success and warning Badge.
• Cookie Consent: one banner and preferences panel for every app and site, opt-in by default, honouring Global Privacy Control, with a cookie inventory per category. It keeps the cc_cookie of @clinia/web-cookiebot, so visitors' choices carry over. See Cookie Consent.
• @clinia/utils: a cn() that knows the type scale, so text-body-s replaces a component's text-sm instead of sitting beside it. New apps get it with base or marketing; existing apps add it. See Migration.
• @clinia/eslint: lint rules for an app's own code. They reject other icon libraries, raw --clinia-* swatches, raw hex colours, arbitrary text sizes, font-semibold and font-bold, rounded-none, corners above rounded-lg, role="button" on an element that isn't a button, and a logo drawn with <img>. See Migration.
• New tokens: border-emphasis for selected outlines and the one emphasis moment per view, and .light, which pins a subtree to the light theme, the counterpart to .dark.
• @clinia/tailwindcss/marketing: marketing-only illustration roles scene-condition, scene-lab and scene-medication, on existing swatches. The theme-marketing item imports it.
• @clinia/tailwindcss/fumadocs: Fumadocs' colour tokens and states from Clinia's theme, for documentation sites built on fumadocs-ui. Import it after the theme, in place of a Fumadocs colour preset. See Migration.
• Marketing components, for marketing surfaces only. CTA, the clinia.com call to action: a mono uppercase label beside a square arrow tile, in primary, default and ghost. Brand Background: BandBackground sets the twist or ring band behind a section, and LineBackground sets a line shape behind a card, with keepAspect for wide, short banners. Logo Strip: a row of customer logos scrolling in a loop, with a Pause button, still under reduced motion and paused off screen. See Custom components and Backgrounds.
• Scene: a marketing kit to compose clinia.com-style patient graphs in code (card, pills, relation tags, lines, source chips) that build in when scrolled into view, and the Rive scenes, with the skills that build both and the marketing lead's approval. See Scenes and Rive scenes.
• Marketing icons, with the 25 IBM Carbon icons clinia.com uses as overrides, approved for marketing surfaces only. They ship in @clinia/marketing-icons, so a site installs no Carbon package. See Marketing icons.
• Brand downloads: transparent PNGs of the mark and the wordmark in Infinite and Serene, a social profile set, profile banners for LinkedIn, YouTube, the B Corp listing, the Trust Center and other platforms, a status page banner, and sharing images, each in a light and a dark version, at 1×, 2× or 3× the platform size. See Logo, Social media and Sharing images.
• A product lockup for a Clinia site that names itself beside the logo, such as the developer documentation. See Logo.
• Conventions shared by app and marketing: Colour, Typography, Containers, including full-width sections, Iconography, Motion, Accessibility with a live contrast matrix, and the Site header shared by the developer documentation and the help centre.
• App patterns: Empty states, Loading, Forms and validation, Destructive actions.
• Marketing guidance: Motion, Icons, Imagery, Line & shape, Co-branding, Social media, Security & compliance and SEO.
• Content guidelines for public content: the voice, a house style for English and French, and how it's written with the clinia-writing skill and approved by marketing in #content-review. Product apps follow each component's copy rules instead. See Content guidelines.
• A migration guide from v1.0.0 and from Radix, for apps with or without shadcn, monorepos, documentation sites on Fumadocs, and apps that keep next/font/local, with the steps to replace the logo and favicon and align each screen with App conventions.
• AI tools: a Markdown version of every page (/docs/color.md, /components/button.md), an /llms.txt index and /llms-full.txt with every page in one file. DESIGN.md is compiled from this site and opens with Clinia's tokens as YAML, so a checker can flag a colour, font, size or corner Clinia UI doesn't ship. See Using AI tools.
• For agents in consuming repositories: the clinia-ui skill, a Claude Code hook that lints each file an agent edits and hands the errors back, a PRODUCT.md template, and a prompt that migrates an existing app one proven pull request at a time. See Using AI tools.
• An accessibility check in CI: axe tests every component demo and state against WCAG 2.2 AA, in Luma and Sera, light and dark.
• Every component page follows one order: when to use, anatomy, Clinia rules, Do and Don't, states, accessibility in three parts, and an API table generated from the component file, with a size table where it has sizes. See Components.
• Every page shows its status: Draft, Ready or Deprecated.

Changed

• The page background is white, as on clinia.com. --background moves from Serene #fffdf9 to #ffffff. Heroes and highlighted sections take Remedy, the warm cream, through bg-muted. See Backgrounds.
• App and marketing components share 8px corners. --radius is 0.5rem, and components use rounded-lg for controls and containers, rounded-md for items inside them and rounded-sm for small parts. Badges and tabs are no longer pills. Reinstall your components to get the new corners. See Containers.
• Every component ships from the @clinia registry, carrying Clinia's colour fixes. An upstream shadcn add no longer undoes them.
• Hover and keyboard highlight take a light ink tint, bg-foreground/4, across buttons, menus, list items and navigation. Selected and current items take Trust: bg-accent/15, plus border-emphasis where the element has a border. Remedy is a surface, never a state. See Colour.
• The chart palette leads with Trust, without Vital. The light --chart-2 is Infinite-5 #333333, 12.63:1 on white, where Thistle measured 1.35:1. See Chart.
• @clinia/theme and @clinia/theme-marketing import the font declarations, tw-animate-css and shadcn/tailwind.css, so dialogs, sheets, popovers, menus, tooltips and accordions animate. Run add @clinia/theme (or @clinia/theme-marketing) again: it replaces globals.css, so put back anything else your app added. See App getting started.
• The brand fonts are self-hosted: seven licensed files, nothing synthesized. See App getting started.
• Typography maps the sizes an app already uses to the scale, allows text-xs, text-sm and text-base alongside it, and sets the link rule. See Typography.
• A highlighted destructive menu item takes a bg-destructive/10 tint, so its red text clears 4.5:1 in both themes. See Dropdown Menu.
• Sonner's toast description takes text-muted-foreground, and toasts in an app without a next-themes ThemeProvider use the light theme. See Sonner.
• Skeleton blocks take bg-foreground/8, an ink tint that follows the theme. See Skeleton.
• An indeterminate Progress slides a segment across the track. With reduced motion it shows a still, faint full-width bar. See Progress.
• A read-only Input takes the Remedy surface, bg-muted, with a border that clears 3:1 on it, so it reads as set rather than editable. See Input.
• An open Accordion item loses its Remedy tint: the chevron shows the state. See Accordion.
• One Docs section with four groups: Getting started, Conventions, App conventions, Marketing conventions. Design guidelines becomes Using AI tools, and /docs/design redirects there. The /theme preview page redirects to Theming.
• Downloadable brand assets sit in one folder per category: /logo/, /favicon/, /social/, /bands/, /backgrounds/, /imagery/, /compliance/, each with its zip inside. Old URLs such as /logomark.svg and /brand/... redirect to the new ones. The infinity-band item no longer includes the Closing the Loop SVGs.
• The site, DESIGN.md and the comments shipped in components and in @clinia/tailwindcss are written in Canadian English: colour, behaviour, centre. Class names, tokens, props and the /docs/color URL keep their spelling, so nothing changes in code.

Fixed

• Disabled Checkbox and Radio Group controls fade to half opacity, and so does a Label beside them. They looked enabled. See Checkbox.
• Keyboard focus shows a solid Trust ring on every control, including the Slider thumb and the Accordion trigger, which had a faint halo or nothing. See Accessibility.
• Card no longer has a shadow: it stands apart by its border. See Card.
• Button link is underlined at rest, so a link in a sentence doesn't rely on colour alone. See Button.
• Slider's aria-label reaches each thumb, so screen readers name the control.
• Avatar Group overlaps its avatars by 4px, so the second initial stays readable. See Avatar.
• tracking-display and tracking-eyebrow set their letter spacing. Tailwind never generated the two classes, so display headlines and eyebrows had none. See Typography.
• Reduced motion also zeroes animation and transition delays, so a staggered entrance appears complete at once.

v1.0.0

The first ui.clinia.dev, from May to October 2026, with @clinia/tailwindcss 0.2 and 0.3 on npm.

Added

• @clinia/tailwindcss: Clinia's brand colours, type and radius as Tailwind v4 tokens, with a light and a dark theme and the sidebar tokens.
• The @clinia shadcn registry, with base, theme, brand-logo and infinity-band, and 23 components: Accordion, Alert, Avatar, Badge, Button, Card, Checkbox, Dialog, Dropdown Menu, Input, Label, Progress, Radio Group, Select, Separator, Skeleton, Slider, Sonner, Switch, Table, Tabs, Textarea and Tooltip.
• Guidelines for the logo and favicon, with the favicon set and a BIMI logomark, and for the Infinity Band, Clinia's line and shape language.
• DESIGN.md: the brand, colour, type and shape for AI agents and engineers.