Create

Shape the Kinetix design language visually, preview it on real components, then export the same theme for web and native platforms.

[08]

Kinetix theme preview

Acme Analytics

Preview

Overview

Last 30 days across all workspaces.

Active users

8,420

12%

Sessions

31,904

Error rate

0.42%

0.1%

Ingest lagging

Two sources are behind by more than an hour.

Traffic by source

Series colours, drawn from the chart tokens.

DirectSearchSocialEmailReferral

Recent runs

Scheduled exports.

Report	Status
Weekly summary	Done
Retention	Running
Billing	Failed

Invite a teammate

They get read access by default.

Seats used18 / 25

Real @kinetixui/ui components, rendered with the configuration on the left. The preview is always web — the native targets below change what Export generates, not what is drawn here. See Theming for what each token controls.

Export

One design, four targets — generated from the same theme.

Custom properties for KinetixUI on the web — React and Angular both read them.

Carries everything: colours, chart palette, radius and surface.

kinetix-theme.css

/* Nothing to override — this is the Kinetix default.
   Change a control above and the CSS appears here. */

Or generate it from a terminal

kinetixui preset css KX1_eyJ2IjoxfQ -o kinetix-theme.css

Needs @kinetixui/cli — it runs the exporter this panel just ran.