Redpine — Brand Guide

Brand

Wordmarkinline
Wordmark · white on ink
Lockupsinline
Wordmark lockups · 4 valid pairs
Black on White
White on Ink
Black on Mauve
White on Red
Faviconinline
Favicon · R mark
R
16px
R
24px
R
32px
R
48px
R
64px
Gradientsinline
Hero gradients
G1
G2
G3
Isometric Marksinline
Isometric marks · 1px stroke
Don'tsinline
Don’t
- Stretch or squash the wordmark.
- Recolor the wordmark outside the 4 approved lockups.
- Place the wordmark on a low-contrast photo.
- Apply shadows, glows or bevels.
- Rotate the wordmark or the isometric marks.
- Recreate the wordmark by typesetting 'Redpine'.

Color

Core Paletteinline
Redpine signature · 4 tokens
White
#FFFFFF
Surface
Mauve
#BFB6B6
Pantone 435 C
Ink
#11090A
Pantone 419 C
Red
#AB2832
Pantone 187 C
Accent & Semanticinline
Accent & semantic
Bright Red (archival)
#FF1423
now aliased to rp-red
Heritage Red
#750014
--heritage-red
Success
#28A745
--success
Warning
#FFC107
--warning
Danger
#DC3545
--danger
Info
#17A2B8
--info
Neutralsinline
Neutrals · 7-step scale
Light Gray 1#F2F4F8
Light Gray 2#DDE1E6
Light Silver#B8C2CC
Silver Gray#8B959E
Dark Silver#626A73
Dark Gray 1#40464C
Dark Gray 2#212326

Typography

Type Familyinline
Primary · Neue Haas Grotesk
Aa
Display + Text · Typekit kit lyr2kyu
Display Scaleinline
Display scale
72 / D1
Systems that scale
48 / D2
Applied AI
32 / D3
Workplace safety
Body Scaleinline
Body scale
20 / lead
Redpine is a technology brand focused on reducing accidents and raising operational efficiency through applied AI.
16 / body
Redpine is a technology brand focused on reducing accidents and raising operational efficiency through applied AI.
14 / small
Redpine is a technology brand focused on reducing accidents and raising operational efficiency through applied AI.
12 / caption
Redpine • ID Guide • 2025
Weightsinline
Weights · Neue Haas
- Applied AI · 300
- Applied AI · 400
- Applied AI · 500
- Applied AI · 600
- Applied AI · 700
Text Measureinline
Measure · max-width ~72ch
Long-form copy caps at roughly 72 characters per line for comfortable reading. Below this is the common ideal between typesetters, pixel fitters and accessibility guidance. Keep body paragraphs here; drop to 52 ch for dense narrative pages.
↑ 72ch gauge — visible line length across devices

Foundations

Spacing Scaleinline
Spacing scale
xs
4px
sm
8px
md
12px
lg
16px
xl
24px
2xl
32px
3xl
48px
4xl
64px
Spacing Tokensinline
Spacing tokens
- --sp-1 = 4px
- --sp-2 = 8px
- --sp-3 = 12px
- --sp-4 = 16px
- --sp-5 = 20px
- --sp-6 = 24px
- --sp-7 = 32px
- --sp-8 = 40px
- --sp-9 = 56px
- --sp-10 = 72px
- --sp-11 = 96px
- --sp-12 = 128px
Type Scaleinline
Tailwind scale · base (from @theme inline)
- text-xscaption, micro12px
- text-smfootnote, small mono14px
- text-basesecondary label16px
- text-lgcard label, dense body18px
- text-xlmeta-row, eye20px
- text-2xlbody default24px
- text-3xlquote body, small h330px
- text-4xlh3 card36px
- text-5xlh3 hero48px
- text-6xlh2 action60px
- text-7xl(reserved)72px
- text-8xlkpi96px
- text-9xlsection title128px
Display tier extension
Added to @theme inline for deck display roles used more than once. Follows the Tailwind numeric ladder; exposes text-10xl / 11xl / 12xl.
- text-10xldisplay cover144px
- text-11xlinsight reveal180px
- text-12xlbignum240px
One-off display ornaments
Off-ladder sizes used exactly once in the deck. Inlined at call site (font-size: 40rem;) with a role comment. If a second consumer emerges, promote to the ladder.
- 8.4rempull quote84px
- 8.8remclose cta-big88px
- 15.6remhook mega156px
- 16remtesti qmark160px
- 22remoutro thanks220px
- 28remsection bignum inline280px
- 40remquote qmark400px
Grid & Breakpointsinline
12-column grid · 24px gutter
1
2
3
4
5
6
7
8
9
10
11
12
- xs 0 · sm 576 · md 768 · lg 1080 · xl 1400
Vertical Rhythminline
Vertical rhythm · 8px baseline
Applied AI for workplace safety
Paragraphs align to the same 8px grid as headings and UI chrome. No off-rhythm half-units anywhere in the product.
Radii Scaleinline
Radii scale
0 · sharp
2 · button / input
4 · card
8 · modal
full · pill
Elevation & Shadowsinline
Elevation
E1 · card
box-shadow: 0 1px 2px rgba(17,9,10,0.06)
E2 · popover
box-shadow: 0 4px 12px rgba(17,9,10,0.10)
E3 · modal
box-shadow: 0 12px 28px rgba(17,9,10,0.16)
Motioninline
Motion · durations + easing
- 120msUI nudgecubic-bezier(0.2, 0, 0, 1)
- 200msDefault transitioncubic-bezier(0.2, 0, 0, 1)
- 360msModal / drawercubic-bezier(0.2, 0, 0, 1)
- instantPage transitionsno interpolation
Rules: no bounces, no springs, scale ≤ 1.02, translate ≤ 8px.
Iconographyinline
Iconography · Lucide · 1.5 stroke
menu
check
close
plus
minus
grid
star
search
layers
clock

Components

Buttoninline
Button variants
Taginline
Tag variants
NeutralRedSilverDarkSuccessWarning
Badgeinline
Status badges
LiveReviewClosedCritical
Cardinline
Card · surface / bordered / elevated / filled
Surface
Hairline border, white background — the default.
Elevated
4px red top rule. Use for primary or featured content.
Read more
KPI Cardinline
Card · KPI + elevated
Accidents · 12mo avg
−42%
Better than last year
Applied AI Overview
Vision models detect PPE and perimeter breaches from CCTV.
CTAinline
CTA · default / primary / brick
Read the brief Request a demo Book a walkthrough
Tabsinline
Tabs · horizontal switch
Platform-wide health across all operating sites.
Accordioninline
Accordion · single-open
Vision models process CCTV streams on-edge. Forecasting models project risk 30-90 min ahead.
Dialoginline
Dialog · static preview (open state)
Confirm deploy
This releases v4.2 to 264 sites in BR + US. You can’t undo from here.
Alertinline
Alert tones
Heads up
Demo slots fill quickly this quarter.
Confirmed
Integration with SAP completed in 41 minutes.
Attention
Perimeter sensor offline at Gate A.
Critical
PPE breach detected · Sector 7.
Blockquoteinline
Blockquote
We replaced three tools and two weekly reports. The board stopped reading PDFs.
— Head of EHS · Industrial operator
Statinline
Stat · default / red
−42%
Accidents
12mo avg
96.1%
PPE compliance
6m 12s
Response time
median
264
Sites live
BR + US
Avatarinline
Avatar · sizes + tones + group
ARBLCMDS
Group
ARBLCMDS
Breadcrumbsinline
Breadcrumbs
1. Platform
2. Safety
3. Incidents
4. INC-10442
Paginationinline
Pagination · 120 items, 10 per page
- Previous
- 1
- 2
- 3
- 4
- 12
- Next
Form fieldsinline
Form fields · Field + Input + Textarea + Select
Work email *Corporate domains only.Sites in scopeWhat should we prepare?Optional. Helps us tailor the demo.PhoneInvalid number format.
Form (legacy)inline
Form · input + label
Work email
Sites in scope
Tableinline
Table · hairline rows
Incident Site Time Status
INC-10442 SP · Plant 04 14:23 Open
INC-10441 SP · Gate A 14:19 Review
INC-10440 US · Floor 2 14:07 Closed
Popoverinline
Popover · non-modal dialog
Click trigger to toggle
Tooltipinline
Tooltip · hover/focus hint
Hover / Tab into the ⓘ icon
Dropdown menuinline
Dropdown menu · roving focus
Arrow/Enter/Esc keyboard nav
Sheetinline
Sheet · side-drawer modal
Focus traps · Esc closes
Separatorinline
Separator · horizontal + vertical
Section above
Section below
Home
Reports
Settings

Incident	Site	Time	Status
INC-10442	SP · Plant 04	14:23	Open
INC-10441	SP · Gate A	14:19	Review
INC-10440	US · Floor 2	14:07	Closed

Patterns

Hero sectioninline
Applied AI · Workplace safety
Systems that scale while you sleep.
Turn chaos into clarity — transforming bottlenecks into engines of growth.
KPI rowinline
KPI row pattern
−42%
Accidents, 12mo
6m 12s
Avg response
96.1%
PPE compliance
264
Sites live
Live data feedinline
Live data feed pattern
Live feed · 264 sites
- 14:23
  PPE breach detected
  SP · Plant 04
  High
- 14:19
  Perimeter anomaly
  SP · Gate A
  High
- 14:07
  Near miss reported
  US · Floor 2
  Med
- 13:58
  Sensor offline
  SP · Line 3
  Low
Sticky bannerinline
Active incident — PPE violation at Site 7
Response team ETA 3m
Camera offline — Gate B
Lost connection 14 minutes ago
Scheduled maintenance tonight
AI features briefly unavailable 02:00-02:30 UTC
View full demo →
Color palettesinline
Snow
snow
Paper
paper
Bone
bone
Ink
ink
Ink+
ink-elevated
Ink++
ink-hover
View full demo →
Form (incident report)inline
Incident report form
Site ID *
S-042
Severity *
Critical — active harm ▾
View full demo →
Search barinline
Search incidents, sites, workers...
infosuccesswarningdanger
View full demo →

System Dashboard

Sidebarinline
Safety · BR + US
Operations
- Overview
- Incidents12
- Risk Register
- Sites
- Team
- Reports
Topbarinline
Safety/Incidents
KPI row (system)inline
KPI row · system dashboard
Open
142
+3
Avg response
6m 12s
−12%
PPE compliance
96.1%
+0.4
Sites live
264
—
Status badgeinline
Status badge · system dashboard
OpenIn ReviewClosedCritical
Data tableinline
Data table · mono IDs + right-aligned numerics
Incident Site Time Count Status
INC-10442 SP · Plant 04 14:23 3 Open
INC-10441 SP · Gate A 14:19 1 Review
INC-10440 US · Floor 2 14:07 2 Closed
INC-10439 SP · Line 3 13:58 1 Closed
Artifact cardinline
Artifact · Risk Assessment
Sector 4 — Q4 Outlook
v4.2
Forecasting detects 1 elevated risk signals in the next 30 minutes. PPE compliance held above 95% for the current shift 2.
Scope pillsinline
Scope pills
ScopeSite: SP Plant 04Window: 24hSeverity: High
Tool badgesinline
Tool badges · mono, single row
read_file42msgrep18mssql.query156msexec1.2s
Slash menuinline
Slash command menu
/deployRelease a story to productionstory_id
/verifyRun verify-deploy against an envenv
/rollbackRevert to previous tagtag
/statusShow active incidents per sitesite?
Mode pickerinline
Mode picker
Operator
default
✓
Analyst
readonly + query
Audit
no mutations
Thinking indicatorinline
Thinking indicator
Thinking · reading 3 files
Timelineinline
Timeline
- Today · 14:23Vision model — PPE breach flagged — Sector 7
- Today · 14:19Sensor grid — Perimeter anomaly — Gate A
- Today · 14:07Operator — Near miss reported — Floor 2
- Today · 13:58System — Sensor offline — Line 3
Filter chipsinline
Filter chips
Segmented controlinline
Segmented control
Input rowinline
Input row · textarea + attach

DS Overview

Brand

Color

Typography

Foundations

Applied AI for workplace safety

Components

Confirm deploy

Patterns

Systems that scale while you sleep.

System Dashboard

DS Overview

Brand

Color

Typography

Foundations

Applied AI for workplace safety

Components

How does Applied AI work?

Which systems integrate?

What compliance posture ships by default?

Confirm deploy

Patterns

Systems that scale while you sleep.

System Dashboard