---
generator: clinical-terminal-brand-kit
company: "OM1, Inc."
domain: "om1.com"
colors:
  primary: "#062EB7"
  onPrimary: "#FAFAFA"
  dark: "#002237"
  accent: "#4169E1"
  background: "#FFFFFF"
ground:
  mode: light
  hex: "#FFFFFF"
  ink: "#002237"
  accent: "#062EB7"
fonts:
  heading: "Playfair Display"
  body: "Archivo"
radius:
  card: "0px"
  button: "0px"
---

# Design System — OM1, Inc.

> Read from OM1, Inc.'s public website (om1.com) by Clinical Terminal. Not reviewed by OM1, Inc..
> Use it as inspiration: borrow the ideas, not OM1, Inc.'s name, logo or identity.

## Ground
- **Light ground** (#FFFFFF), from OM1, Inc.'s site background #FFFFFF. Pages and panels sit on it.
- Main text: #002237 (16.36:1 on the ground).
- Secondary text is #002237 at 88% / 76% / 60%; hairlines and plate borders #002237 at 16%.

## Color
- **Accent on the ground: #062EB7** (10.08:1). Use it for kickers, key numbers and one highlight per screen, not for large fills.
- **Primary #062EB7** for filled shapes (buttons, chips, bars), with #FAFAFA text on it (9.66:1).
- Secondary accent #4169E1: charts and a second data series only.
- Quote every hex exactly as written above.

## Type
- Headlines: **Playfair Display**. Body: **Archivo**. Both on Google Fonts.
- OM1, Inc.'s site uses Playfair Display / sans-serif; these are the closest free look-alikes.

## Shape
- Cards and panels: 0px corners. Buttons and chips: 0px.

## Voice
- Tone: professional. Energy: low. Written for enterprises.
- Headlines are short and concrete.

## Tokens from the site's stylesheets

### Color ramps

- **Chart** (`--chart-N`): 1 `#F05100` · 2 `#009588` · 3 `#104E64` · 4 `#FCBB00` · 5 `#F99C00`

### Other named colors

- `--color-light`: `#F7F5F1`
- `--color-primary-blue`: `#082EB9`
- `--color-secondary-blue`: `#66BEF4`
- `--color-bright-blue`: `#57DCF9`
- `--color-light-blue`: `#AFDBF5`
- `--color-dark`: `#002237`
- `--color-white`: `#FFFFFF`
- `--color-orange`: `#FF8952`
- `--color-light-orange`: `#FFB989`
- `--color-purple`: `#7533C0`
- `--color-light-purple`: `#EEB7FF`
- `--color-green`: `#81A01E`
- `--color-yellow`: `#F2CF5C`
- `--color-inactive-gray`: `#6E6E6E`
- `--background`: `#FFFFFF`
- `--foreground`: `#0A0A0A`
- `--card`: `#FFFFFF`
- `--card-foreground`: `#0A0A0A`
- `--popover`: `#FFFFFF`
- `--popover-foreground`: `#0A0A0A`
- `--primary`: `#171717`
- `--primary-foreground`: `#FAFAFA`
- `--secondary`: `#F5F5F5`
- `--secondary-foreground`: `#171717`
- `--muted`: `#F5F5F5`
- `--muted-foreground`: `#737373`
- `--accent`: `#F5F5F5`
- `--accent-foreground`: `#171717`
- `--destructive`: `#E40014`
- `--border`: `#E5E5E5`
- `--input`: `#E5E5E5`
- `--ring`: `#A1A1A1`
- `--sidebar`: `#FAFAFA`
- `--sidebar-foreground`: `#0A0A0A`
- `--sidebar-primary`: `#171717`
- `--sidebar-primary-foreground`: `#FAFAFA`
- `--sidebar-accent`: `#F5F5F5`
- `--sidebar-accent-foreground`: `#171717`
- `--sidebar-border`: `#E5E5E5`
- `--sidebar-ring`: `#A1A1A1`
- `--orejime-color-background`: `#FFFFFF`
- `--orejime-color-text`: `#1A1A1A`
- `--orejime-color-primary`: `#0070F3`
- `--orejime-color-primary-hover`: `#0051A2`
- `--orejime-color-secondary`: `#F3F4F6`
- `--orejime-color-secondary-hover`: `#E5E7EB`
- `--orejime-color-link`: `#0070F3`
- `--color-gray-1`: `#EAE8E5`
- `--color-gray-2`: `#D8D5D0`

### Typefaces

- Playfair Display (`--font-playfair`) — on Google Fonts
- Inter (`--font-inter`) — on Google Fonts
- Playfair Display Fallback
- Inter Fallback

### Type scale (most-used sizes)

`4rem` · `3rem` · `2.5rem` · `2.25rem` · `2rem` · `1.875rem` · `1.625rem` · `1.5rem` · `1.375rem` · `1.0625rem` · `1rem` · `.8125rem`

### Letter-spacing

`-.01em` (15) · `.04em` (1) · `.05em` (1) · `.06em` (1)

### Corner radii (most-used)

`6px` · `1px` · `4px` · `8px` · `10px` · `10rem` · `32px` · `40rem` · `48px` · `64px`