STUMP JERRY'S BRAINS — Framer Asset Kit

StumpJerrysBrains.com

What's in this kit

sjb-framer-kit/
│
├── FRAMER-GUIDE.md          ← START HERE — full build guide
│
├── svgs/
│   ├── brain-web-hero.svg   ← Hero background (set opacity 7-8%)
│   ├── node-diagram.svg     ← Story section illustration
│   ├── thebrain-mockup.svg  ← Brain demo section mock-up
│   └── wordmark.svg         ← Logo wordmark (two versions)
│
├── css/
│   └── tokens.css           ← All design tokens + animations
│                               (paste into Framer custom code)
│
├── components/
│   └── framer-code-snippets.js  ← Four ready-to-paste Framer
│                                   code components:
│                                   · Ticker animation
│                                   · FAQ accordion
│                                   · Chamfered primary button
│                                   · Animated brain web
│
└── copy/
    └── site-copy.md         ← Every word on the site, organized
                                by section, ready to paste into
                                Framer text layers

Also included in your downloads:

index.html — The complete, working prototype of the site (drop on netlify.com/drop to publish in 60 seconds)
framer-asset-kit.html — Visual reference for all components (open in browser while building in Framer)
StumpJerrysBrains_StrategyPlan.docx — The full strategy document

The short version

Read FRAMER-GUIDE.md
Start with a blank Framer canvas (not a template)
Add fonts + color tokens (Phase 1 of the guide)
Drag SVGs from this kit onto the canvas
Paste copy from site-copy.md into text layers
Add code components from framer-code-snippets.js
Apply scroll animations to each section
Publish

Total build time: ~5.5 hours if comfortable with Framer.

Design palette (quick reference)

Name	Hex	Use
Ink	#0A0A0A	Backgrounds, text, borders
Paper	#FAF7F2	Page background
Cream	#F5F0E8	Text on dark
Canary	#F7C948	Accent, CTAs, ticker
Ember	#E8531A	CTA hover, 's' in logo
Navy	#1A3A5C	Story + How It Works sections
Teal	#2A9D8F	TheBrain color, labels
Mid	#8A7F70	Secondary text

Fonts

Font	Use	Weights
Bebas Neue	Headlines, prices	(single weight)
Syne	UI, cards, body	400, 700, 800
IBM Plex Mono	Labels, metadata	400, 500
Playfair Display	Provocation, quotes	italic 400, italic 700

All are free via Google Fonts. Add in Framer: Site Settings → Fonts → Add Google Font.

StumpJerrysBrains.com · Jerry Michalski · 2026

Site Navigation