RETA+ Design System  ·  v1.0 · 2026 · Internal reference · Single source of truth
Design System / 01 / Reference

The RETA+
component library.

v1.0 · 2026
Tokens · Components · Behavior
Maintained by RETA+ Design
01 · Foundations

Colors & tokens.

Quietly expensive. Surfaces sit in the void-to-carbon range; gold accents do all the speaking. Every value lives as a CSS custom property prefixed --rt-.

Surfaces

tokens.css
Void#070707
Graphite#111111
Soft Carbon#1A1A1A

Brand · Gold

tokens.css
Satin Gold#C8A96B
Deep Gold#9B7A3D
Champagne#E5D1A3

Typography

tokens.css
Ivory#EAEAEA
Muted#7A7A7A
02 · Foundations

Typography.

Three families. Cormorant Garamond carries every editorial moment. Inter handles UI and body. JetBrains Mono labels every spec.

Cormorant Garamond · Serif

--rt-serif
Display92px / 300
The next wave of research.
H254px / 300
Two compounds. One standard.
H328px / 400
Reagent Dispenser · Retatrutide

Inter · Sans

--rt-sans
Body15px / 300
Advanced compounds. Precise science. Elevated standards. Premium laboratory dispensing instruments engineered for calibrated volume delivery.
Eyebrow11px / 500
Catalogue · Series 01

JetBrains Mono

--rt-mono
Spec value10.5px
SKU · RP-001 · TRIPLE AGONIST · 99.6% HPLC
03 · Foundations

Spacing & radii.

A 4px-rooted scale. Surfaces rarely round — corners stay sharp; only the tweak controls and product case soften.

Spacing scale

--rt-space-*
space-1 · 4
space-2 · 8
space-4 · 16
space-6 · 24
space-8 · 32
space-12 · 48
space-16 · 64
space-24 · 96
space-32 · 128
04 · Components

Buttons.

Three variants. Slim padding, generous letter-spacing. Primary uses gradient + soft glow; ghost recedes; default is the neutral catalogue button.

Variants

styles/buttons.css
05 · Components

Product card.

Editorial product card. Spec block + price + add-to-cart action.

Card

styles/card.css
SKU · RP-001 · Triple AgonistFlagship
3ml reservoirR+

Reagent Dispenser · Retatrutide

Pre-loaded research reservoir · GLP-1/GIP/Glucagon
Purity99.6%
FormatPre-loaded
Volume3 ml
Storage2–8°C
£289per unit
SKU · RP-003 · Dual AgonistFlagship
3ml reservoirR+

Reagent Dispenser · Tirzepatide

Pre-loaded research reservoir · GLP-1/GIP
Purity99.6%
FormatPre-loaded
Volume3 ml
Storage2–8°C
£198per unit
06 · Components

Dialog.

Editorial modal. Driven by the DialogProvider context — open via a DialogTrigger, close via the corner button, backdrop click, or Escape.

Examples

components/dialog/*
07 · Components

Eyebrow & meta.

The connective tissue of every section. Always uppercase, always lettered out, always introduced by a 24-px gold rule.

Examples

styles/base.css
Catalogue · Series 01 · 2026Philosophy · 003Standards · The protocolAn invitation