Skill Wiki
Framer
Dark-first cinematic tool aesthetic: GT Walsheim at 500 weight only with extreme -5.…
$ prime install @community/persona-framerProjection
Always in _index.xml · the agent never has to ask for this.
Framer [persona] v1.0.0
Dark-first cinematic tool aesthetic: GT Walsheim at 500 weight only with extreme -5.5px tracking at 110px making headlines feel spring-loaded, void-black #000000 canvas with electric Framer Blue #0099ff as sole accent, and Inter Variable with 6+ OpenType features (cv01, cv05, cv09, cv11, ss03, ss07) giving body text a subtly custom character.
Loaded when retrieval picks the atom as adjacent / supporting.
Framer [persona] v1.0.0
Dark-first cinematic tool aesthetic: GT Walsheim at 500 weight only with extreme -5.5px tracking at 110px making headlines feel spring-loaded, void-black #000000 canvas with electric Framer Blue #0099ff as sole accent, and Inter Variable with 6+ OpenType features (cv01, cv05, cv09, cv11, ss03, ss07) giving body text a subtly custom character.
School
framer
Implies
- Font:
- Display: GT Walsheim Framer Medium / GT Walsheim Medium — weight 500 only, never bold (700), never regular (400); -5.5px tracking at 110px / -4.25px at 85px / -3.1px at 62px
- Body: Inter Variable with OpenType cv01, cv05, cv09, cv11, ss03, ss07 — 15px nav/UI; Mona Sans weight 100 for ultra-light ethereal accents
- Monospace: Azeret Mono — also Open Runde as rounded micro-companion for tags/badges
- Color:
- Temperature: cool
- Palette: void black #000000 absolute (not #0a0a0a), pure white #ffffff text, Framer Blue #0099ff sole accent, blue glow ring rgba(0,153,255,0.15) borders, muted silver #a6a6a6 secondary, elevated dark surface #090909, frosted glass rgba(255,255,255,0.1) buttons
- Background: #000000 pure void black — not warm charcoal, not near-black, void is sacred
- Density: cinematic spacious — 110px display with line-height 0.85 (sub-baseline stacking), section padding 80–120px vertical, max content ~1200px, 100px full-pill CTAs
- Layout: full-bleed dark canvas, product screenshots as hero art, feature sections with blue-ring-bordered cards, pill-only CTAs (40–100px radius throughout)
- Imagery: full-fidelity product screenshots dominate as hero art — Framer as proof-of-concept; no stock photography; the tool demonstrates itself
- Motion: kinetic — GT Walsheim's extreme tracking makes headlines feel spring-loaded even statically; animated product demos, elevated float shadow (rgba(255,255,255,0.1) top highlight + rgba(0,0,0,0.25) deep ambient), spring-config for interactive elements
Example Brands
- Framer
Composition
- Must Include:
- @impeccable/template-spring-config
- @impeccable/template-oklch-dark-mode-cascade
- @community/rule-opentype-features-on
- Must Avoid:
- @impeccable/persona-warm-institutional
- @impeccable/persona-magazine-editorial
- Typography Required:
- Display: GT Walsheim Medium (weight 500 only)
- Tracking: -5.5px at 110px, -4.25px at 85px, -3.1px at 62px
- Body Opentype: cv01, cv05, cv09, cv11, ss03, ss07
- Color Required:
- Background: #000000 (void black — not #0a0a0a)
- Accent: #0099ff
- Border Style: rgba(0,153,255,0.15) 0px 0px 0px 1px
- Motion Prescriptions:
- @impeccable/template-spring-config
- @impeccable/template-easing-curves
Loaded when retrieval picks the atom as a focal / direct hit.
Framer [persona] v1.0.0
Dark-first cinematic tool aesthetic: GT Walsheim at 500 weight only with extreme -5.5px tracking at 110px making headlines feel spring-loaded, void-black #000000 canvas with electric Framer Blue #0099ff as sole accent, and Inter Variable with 6+ OpenType features (cv01, cv05, cv09, cv11, ss03, ss07) giving body text a subtly custom character.
School
framer
Implies
- Font:
- Display: GT Walsheim Framer Medium / GT Walsheim Medium — weight 500 only, never bold (700), never regular (400); -5.5px tracking at 110px / -4.25px at 85px / -3.1px at 62px
- Body: Inter Variable with OpenType cv01, cv05, cv09, cv11, ss03, ss07 — 15px nav/UI; Mona Sans weight 100 for ultra-light ethereal accents
- Monospace: Azeret Mono — also Open Runde as rounded micro-companion for tags/badges
- Color:
- Temperature: cool
- Palette: void black #000000 absolute (not #0a0a0a), pure white #ffffff text, Framer Blue #0099ff sole accent, blue glow ring rgba(0,153,255,0.15) borders, muted silver #a6a6a6 secondary, elevated dark surface #090909, frosted glass rgba(255,255,255,0.1) buttons
- Background: #000000 pure void black — not warm charcoal, not near-black, void is sacred
- Density: cinematic spacious — 110px display with line-height 0.85 (sub-baseline stacking), section padding 80–120px vertical, max content ~1200px, 100px full-pill CTAs
- Layout: full-bleed dark canvas, product screenshots as hero art, feature sections with blue-ring-bordered cards, pill-only CTAs (40–100px radius throughout)
- Imagery: full-fidelity product screenshots dominate as hero art — Framer as proof-of-concept; no stock photography; the tool demonstrates itself
- Motion: kinetic — GT Walsheim's extreme tracking makes headlines feel spring-loaded even statically; animated product demos, elevated float shadow (rgba(255,255,255,0.1) top highlight + rgba(0,0,0,0.25) deep ambient), spring-config for interactive elements
Example Brands
- Framer
Composition
- Must Include:
- @impeccable/template-spring-config
- @impeccable/template-oklch-dark-mode-cascade
- @community/rule-opentype-features-on
- Must Avoid:
- @impeccable/persona-warm-institutional
- @impeccable/persona-magazine-editorial
- Typography Required:
- Display: GT Walsheim Medium (weight 500 only)
- Tracking: -5.5px at 110px, -4.25px at 85px, -3.1px at 62px
- Body Opentype: cv01, cv05, cv09, cv11, ss03, ss07
- Color Required:
- Background: #000000 (void black — not #0a0a0a)
- Accent: #0099ff
- Border Style: rgba(0,153,255,0.15) 0px 0px 0px 1px
- Motion Prescriptions:
- @impeccable/template-spring-config
- @impeccable/template-easing-curves
Relations
contradicts: [@impeccable/persona-warm-institutional, @impeccable/persona-magazine-editorial]
Compatible
- vercel-clean
- brutalist
- swiss-modernist
Conflicts
- warm-institutional
- notion-warm
- magazine-editorial
- stripe-fintech
Contradicts
- @impeccable/persona-warm-institutional
- @impeccable/persona-magazine-editorial
Source
prime-system/examples/frontend-design/primes/compiled/@community/persona-framer/atom.yaml