---
generator: clinical-terminal-brand-kit
company: "TELCOR Inc"
domain: "telcor.com"
colors:
  primary: "#263349"
  onPrimary: "#FFFFFF"
  dark: "#000000"
  accent: "#E01849"
  background: "#FFFFFF"
ground:
  mode: light
  hex: "#FFFFFF"
  ink: "#000000"
  accent: "#263349"
fonts:
  heading: "Poppins"
  body: "Poppins"
radius:
  card: "8px"
  button: "8px"
---

# Design System — TELCOR Inc

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

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

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

## Type
- Headlines: **Poppins**. Body: **Poppins**. Both on Google Fonts.

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

## Voice
- Tone: professional. Energy: medium. Written for patients and healthcare professionals.
- Headlines are short and concrete.

## Tokens from the site's stylesheets

### Typefaces

- Poppins — on Google Fonts
- Inter Tight — on Google Fonts
- sans-serif !important

### Type scale (most-used sizes)

`62px` · `38px` · `28px` · `26px` · `24px` · `22px` · `21px` · `18px` · `16px` · `15px` · `14px` · `12px`

### Letter-spacing

`1px` (2) · `.5px` (1)

### Corner radii (most-used)

`8px` · `50%` · `4px` · `6px` · `20px` · `35px` · `50px` · `7px` · `2px` · `14px`

### Shadows

- `0 0 10px #000`
- `none!important`
- `0 0 20px 1px rgba(0,0,0,.1)`
- `none !important`
- `0 1px 3px rgba(0,0,0,.18)`
- `0 0 3px 3px rgba(2,114,252,.7)`

### Gradients

- `radial-gradient(circle,#fff,#000)`
- `linear-gradient(90deg,#000,#208291)`
- `linear-gradient(180deg,transparent,#5a7c81,transparent)`
- `linear-gradient(90deg,#000,#e01849)`

### Breakpoints

400px · 509px · 510px · 568px · 575px · 576px · 767px · 768px · 769px · 860px · 922px · 923px · 992px · 1000px · 1100px · 1200px · 1260px · 1280px