Slite

About Slite

A knowledge base and team docs platform. Fits productivity SaaS, knowledge-base tools, internal-wiki apps, and team-collab landing page designs.

Request a DESIGN.md analysisCustom, made for Slite Website Starter KitBuild your site from a starter template

Design tokens

17 colors · 9 type styles

Cool graphite (#2d2f34) primary on a cream (#f9efe4) canvas, set in Garnett for headlines and UniversalSans for body text. The highlights below are read from the Slite DESIGN.md in the Pass bundle, which carries all 17 color tokens, 9 type styles and the full component rules.

Colors

Primarycool graphite#2d2f34
Canvascream#f9efe4
Surfacepure white#fdfdfd
Inkcool graphite#2d2f34

Type

GarnettDisplayweight 500, 36 to 64px
UniversalSansBodyweights 400, 500, 600, 700, 16px

Radius

none 0px
sm 6px
md 8px
lg 12px
xl 16px
pill 50px
full 9999px

Spacing

xxs 2px
xs 4px
sm 8px
md 12px
lg 16px
xl 24px
xxl 32px
section 80px

Components

Primary buttonbutton-primary
Primary buttons fill with cool graphite (#2d2f34) and carry pure white (#fdfdfd) text, set in UniversalSans 14px at weight 500, with pill corners (50px) and 8px 24px padding.
Cardfeature-card
Cards sit on pure white (#fdfdfd), with 16px corners and 24px padding.
Navigationnav-bar
The top navigation runs on pure white (#fdfdfd) with cool graphite (#2d2f34) links, set in UniversalSans 14px at weight 500, in a 60px bar.

Three ways to ship a Slite-style UI.

Use in your AI builder, no-code tool, or CMS

Lovablev0BoltFramerWebflowWordPressWixSquarespace CanvaGoDaddy

Paste the DESIGN.md in and ask the tool to restyle your existing site to match this design, or start a brand new one from scratch with the same visual language.