⚠️ Mobile is not supported yet.

Command Palette

Search for a command to run...

[Explore]
[Search]
[Saved]

Terms of Service Privacy Policy

VeloBits Theme – shadcn/ui Theme by velobits | shadcnregistry

Registries
velobits
VeloBits Theme

VeloBits Theme

theme

The full token layer as CSS variables. Every colour pair here is contrast-verified in both themes by the @velobitsio/tokens test suite.

Provided by velobits

Open in https://v0.dev/Open in

Installation

Install directly from the provider.

pnpm dlx shadcn@latest add "https://ui.velobits.dev/r/velobits-theme.json"

Files

No files found

Styles

Light Mode

--bg:

#F4EDEA

--bg2:

#F2EBE8

--panel:

#FFFFFF

--elevated:

#FFFFFF

--fg:

#2A2B2A

--muted-fg:

#646562

--muted-on-glass:

#464745

--border:

#D0CBC7

--field-border:

#82827E

--primary:

#007ACC

--primary-hover:

#0062A3

--on-primary:

#FFFFFF

--primary-text:

#0062B3

--primary-soft:

rgba(0, 122, 204, 0.10)

--brand:

#C8F135

--on-brand:

#2A2B2A

--brand-hover:

#BCE52B

--brand-soft:

rgba(200, 241, 53, 0.18)

--accent-text:

#582840

--code:

#101828

--on-code:

#7DF3B1

--ring:

#007ACC

--highlight:

rgba(42, 43, 42, 0.05)

--overlay:

rgba(26, 27, 26, 0.45)

--success:

#226E25

--success-soft:

rgba(34, 110, 37, 0.12)

--danger:

#B82A24

--danger-soft:

rgba(184, 42, 36, 0.10)

--on-danger:

#FFFFFF

--danger-hover:

#9E231E

--warning:

#855600

--warning-soft:

rgba(133, 86, 0, 0.12)

--info:

#256262

--info-soft:

rgba(37, 98, 98, 0.12)

--rose:

#9B3E6B

--rose-soft:

rgba(155, 62, 107, 0.12)

--chart-1:

#1D82D2

--chart-2:

#6F8714

--chart-3:

#BC5F8D

--chart-4:

#AF7011

--chart-5:

#368A8A

Dark Mode

--bg:

#151615

--bg2:

#2C2D2C

--panel:

#2C2D2C

--elevated:

#592941

--fg:

#F2EBE8

--muted-fg:

#A5A39F

--muted-on-glass:

#E4DEDB

--border:

#383635

--field-border:

#82827E

--primary:

#007ACC

--primary-hover:

#1177BB

Theme

--radius-sm:

4px

--radius-md:

6px

--radius-lg:

10px

--radius-xl:

14px

--radius-2xl:

20px

--radius-pill:

999px

--container-page:

72rem

--duration-micro:

120ms

--duration-enter:

180ms

--duration-overlay:

240ms

--duration-page:

CSS

No CSS found.

--on-primary:

#FFFFFF

--primary-text:

#4AACFF

--primary-soft:

rgba(0, 122, 204, 0.22)

--brand:

#C8F135

--on-brand:

#2A2B2A

--brand-hover:

#BCE52B

--brand-soft:

rgba(200, 241, 53, 0.16)

--accent-text:

#C8F135

--code:

#101828

--on-code:

#7DF3B1

--ring:

#3094E8

--highlight:

rgba(242, 235, 232, 0.06)

--overlay:

rgba(14, 15, 14, 0.60)

--success:

#7FB86B

--success-soft:

rgba(127, 184, 107, 0.12)

--danger:

#FF7F79

--danger-soft:

rgba(255, 127, 121, 0.12)

--on-danger:

#2A2B2A

--danger-hover:

#FF9A95

--warning:

#E0C060

--warning-soft:

rgba(224, 192, 96, 0.12)

--info:

#6FBAB9

--info-soft:

rgba(111, 186, 185, 0.12)

--rose:

#DA8FB2

--rose-soft:

rgba(218, 143, 178, 0.12)

--chart-1:

#2387D7

--chart-2:

#738C1B

--chart-3:

#C06492

--chart-4:

#B37519

--chart-5:

#3B8F8E

320ms

--ease-out:

cubic-bezier(0.32, 0.72, 0, 1)

--ease-in:

cubic-bezier(0.4, 0, 1, 1)