Grafana Labs (light) tokens. Measured from grafana.com/, 2026-09-23. Headings use Poppins 600 with tight tracking (-0.025em: h1 60px/-1.5px, h2 48px/-1.2px, h3 30px/-0.75px); body Inter.
Sign in to use this theme
The install commands for Tailwind v4, Tailwind v3 and plain CSS, the ready-made agent prompts, and this theme's radius, shadow and motion tables open up when you sign in. Free, one click.
You don't need an account to use it: https://stylelift.dev/use/grafana is the same instructions as plain text, and every generated file stays open.
Colours
bg #f4f4f6surface #ffffffsurface-muted #f9f9fasurface-strong #e6e6easurface-inverse #2b2d32surface-primary #17171cfg #000000fg-body #454554fg-muted #67677efg-strong #2e2e38fg-disabled #aeaebcborder #d8d8dfborder-strong #bcbcc8border-hover #2e2e38accent #1b55f5accent-fg #ffffffaccent-hover #1440e1accent-focus #19318fsecondary #f4f4f6secondary-fg #2e2e38secondary-hover #e6e6earing #19318flink #1b55f5link-hover #1734b6brand #ff671dbrand-fg #f04306brand-surface #ffe8dddanger #d92d20danger-strong #a42f26danger-surface #fbc7c3success #0b9065success-fg #097347success-surface #d1f0e1warning #ff8200warning-fg #af450awarning-surface #ffe899info #1440e1info-surface #bcd8ffbeta #9d1ab1beta-surface #f9e8ffoverlay rgba(0, 0, 0, 0.1)nav-bg #fffffffooter-bg #f9f9fa
Typography
headingPoppins — Æ Ø Å 0123
text-xs · 12pxReiseplanlegger for hele landet
text-sm · 13pxReiseplanlegger for hele landet
text-base-sm · 14pxReiseplanlegger for hele landet
text-base · 16pxReiseplanlegger for hele landet
text-lg · 18pxReiseplanlegger for hele landet
text-xl · 20pxReiseplanlegger for hele landet
text-2xl · 24pxReiseplanlegger for hele landet
text-3xl · 30pxReiseplanlegger for hele landet
text-4xl · 36pxReiseplanlegger for hele landet
text-5xl · 48pxReiseplanlegger for hele landet
text-6xl · 60pxReiseplanlegger for hele landet