Coral
Frame System
Vol. 01 / 1920×1080
01

Solid planes,
hard edges.

A bold magazine-poster system in motion. Three surfaces — coral fire, ink black, warm cream — meeting at hard color edges, animated by Bebas Neue caps and a constant 45° hatch.
01

Palette

Three surfaces + ink + neutrals
Coral
#E85D5D
The signature — accent and full-region environment.
Coral Dark
#D44A4A
Gradient stop + chart comparison series.
Cream
#F5F0E8
The warm canvas — magazine paper.
Black
#1A1A1A
Strongest surface; quote + statement grounds.
Cream Dark
#E8E0D4
Subtle region differentiation; info bars.
Gray
#6B6B6B
Body paragraphs, labels, meta.
Light Gray
#B0B0B0
Tertiary text on ink surfaces.
White
#FFFFFF
Card fills against coral or cream.
02

Typography

Bebas Neue + Inter
hero-title
Bebas Neue · 120px · 4px track
uppercase always · line 0.9
Coral Fire
jumbo-feature
Bebas Neue · up to 200px · 12px track
2026
section-headline
Bebas Neue · 80px · 2px track
Hard Color Edges
body-light
Inter · weight 300 · pull-quote voice

The voice break — Inter Light takes over when content needs to feel personal rather than declarative.

section-label
Inter · 700 · 4px track · uppercase
Fig. 02 — Type Specimen
03

Components

Flat · hard edges · coral borders
Column cards — white fill, 5px coral top border, 48px icon square
A
Region Split
Solid color planes meet at a hard edge. The boundary is the layout.
01
B
Diagonal Hatch
A 45° 6%-opacity overlay gives coral regions texture without depth.
45°
C
Wallpaper Numeral
Oversized Bebas at 12% opacity sits behind a region's title.
12%
Sidebar tiles — 4px coral left border
240%
Output Lift
3.4×
Faster Cuts
12K
Frames Shipped
Accent rule + info bar
CoverageCoral · Ink · Cream
Card icon
Timeline — ink line, coral nodes, cream halo
Plan
Block
Set
Ship
04

Frame Compositions

True 16:9 · cqw scaled
05

Frame Rules

Flat · hard-edge · coral

Do

  • Compose as multi-surface region splits — coral, ink, cream at hard edges.
  • Set every Bebas element uppercase with 1–12px letter-spacing.
  • Render eyebrows in coral on cream/ink, in ink on coral.
  • Apply the 45° hatch at 6% opacity on coral regions.
  • Fill underweight coral regions with a 12%-opacity wallpaper numeral.

Don't

  • Never render Bebas in sentence case or without tracking.
  • No fourth surface; no drop shadows, elevations, or rounded rectangles.
  • No white headlines on coral — Bebas on coral is always ink.
  • No gray headlines; gray is body and meta only.
  • Don't pair Bebas with a different body sans than Inter.
Coral Frame Showcase · Atoms Sacred · Composition Free