Overview
Design light event pages that feel premium, editorial, and current. The system should balance oversized headings and generous white space with one unmistakable prismatic visual language that makes the conference feel vivid without clutter.
Stripe Sessions 2026
Stripe Sessions is a 2-day, in-person event with discussions about important internet economy trends, the future of commerce, and Stripe product updates. Register now to secure your spot.
3.0
10
Visits
Available Pages
Version History
Workflow Collections
Design Analysis
Stripe Sessions 2026 Home design analysis
Design light event pages that feel premium, editorial, and current. The system should balance oversized headings and generous white space with one unmistakable prismatic visual language that makes the conference feel viv...
Image Direction
Use diagonal ribbon imagery with magenta, violet, and apricot light transitions as the core brand signal. Photos or videos should feel secondary to this geometric light treatment and should sit within a disciplined editorial frame.
Colors
Keep the background soft and neutral. Use deep plum for almost all typographic weight, with violet reserved for active states and ribbon lift. Let magenta and apricot show up primarily inside the hero artwork, not in generic components.
Typography
Use a single editorial sans across the system. Headlines can be huge, light, and tightly tracked, while body copy stays neutral and low-drama. This is a clean event poster voice, not a product dashboard voice.
Design.md
System Overview
Core identity and authoring metadata from the refto.one design model.
Prismatic Conference Minimalism
An editorial conference system with off-white space, deep-plum typography, and prismatic ribbon accents.
editorial, spacious, and luminous with a single strong prismatic motif
Primary mode: lightconference marketingevent-marketing
Theme
Fields outside the primary renderer remain visible here as structured fallback content.
Visual atmosphere
Summary
editorial, spacious, and luminous with a single strong prismatic motif
Density
2
Variance
3
Motion
2
Signals
off-white canvas · deep plum typography · magenta-violet ribbons · capsule buttons
Colors
Primitive palettes and resolved token colors for the active preview mode.
Palette colors
Paper White
#F9F7F7
Deep Plum
#20033C
Event Violet
#883FFF
Hot Magenta
#FF2ACB
Warm Apricot
#F7C86E
Soft Stone
#DBD7D7
Clean White
#FFFFFF
Usage rules
Keep the base almost white and let the ribbon art provide the emotional saturation.
Use plum for text, key buttons, and high-contrast anchors.
Reserve violet, magenta, and apricot for prismatic artwork and active moments.
Token Spacing
Spacing scales rendered as tokens with a simple length specimen.
xs
6px
sm
12px
md
20px
lg
32px
section
112px
Token Radii
Corner radii tokens with a live surface sample.
sm
8px
md
16px
lg
28px
full
999px
Typography Families
Font families from the current design YAML, including fallback stacks and usage character.
Display
Sohne Var
editorial, clean, and large-scale
Body
Sohne Var
clear event and schedule copy
Mono
Sohne Var
same family; no true mono voice required
Typography Scale
Top-level typography scale rendered as live text specimens.
Display
5rem/—
Display
H2
2.25rem/—
H2
Body
1rem/—
Body
Caption
0.875rem/—
Caption
Typography Rules
Fields outside the primary renderer remain visible here as structured fallback content.
Rules
Push hero headlines large and lightweight, with generous white space around them. · Keep supporting copy crisp and minimal; the layout should do most of the work. · Avoid introducing extra typographic personalities beyond the core sans.
Motion
Motion tokens rendered as resolved values for timing and personality.
Duration
180ms-360ms
Easing
cubic-bezier(.2,.8,.2,1)
Spring
stiffness 100, damping 18
Motion
Resolved motion token values.
| Property | Value |
|---|---|
duration | 180ms-360ms |
easing | cubic-bezier(.2,.8,.2,1) |
spring | stiffness 100, damping 18 |
Layout Principles
Let giant editorial headings own the upper-left field.
Use ribbon imagery as a diagonal counterweight rather than a full background wash.
Treat subpages like clean continuations of the same event shell.
Component Preview
Low-complexity component tokens rendered as design-system specimens.
Buttons primary
Base Attributes
Background
#20033C
Text
#FFFFFF
Border
1px solid #20033C
Radius
999px
Padding
12px 24px
Min height
40px
Buttons secondary
Base Attributes
Background
#DBD7D7
Text
#20033C
Border
1px solid #DBD7D7
Radius
999px
Padding
12px 20px
Min height
40px
Navigation link
OverviewFeaturesDocs
Base Attributes
Background
transparent
Text
#20033C
Active text
#883FFF
Item padding
8px 10px
Item radius
999px
Cards speaker
Feature Card
Component preview content
Base Attributes
Background
#F9F7F7
Text
#20033C
Border
1px solid #DBD7D7
Radius
24px
Padding
24px
Badges floating
Base Attributes
Background
#20033C
Text
#FFFFFF
Border
0px none transparent
Radius
999px
Padding
16px
Image direction
Schema-agnostic optional blocks from the design YAML. New option keys render here automatically.
Role
load-bearing
Media types
- -prismatic gradient ribbons
- -speaker imagery
- -conference video
Subject patterns
- -diagonal bands
- -soft light flare
- -cropped event portraits
Composition logic
- -Use one large geometric artwork region per hero.
- -Keep imagery offset from the headline block instead of centered behind it.
Treatment rules
- -Prefer smooth luminous gradients over noisy textures.
- -Keep page chrome minimal so the ribbons stay special.
Generation cues
- -conference editorial hero with violet-magenta ribbons
- -off-white tech event poster
Avoid
- -No corporate stock photography grid.
- -No rainbow gradients outside the ribbon language.
Anti Patterns
Compact list of patterns the design system explicitly avoids.
- -Do not darken the entire site just because the CTA is dark.
- -Do not introduce extra brand colors beyond the ribbon spectrum.
- -Do not compress the layout into dense SaaS blocks.