Alo Editions · III

Void.

Spectral absence.
Negative space as material.

48 ComponentsFramer Library
2 ThemesDark + Light
120+ TokensDesign System
v7 RuntimeSSR-Safe

Embrace Your Vision

I. Concept

The premise.

Strip until only essence remains. This is the territory Edition VOID claims — and the foundation every component is built upon.

Radical Subtraction

Strip until only essence remains. Every element earns its place through necessity, not decoration. Void is what happens after you remove everything that does not matter.

Spectral Lightness

Spectral 200 italic — hair-thin strokes that barely disturb the surface. Type that whispers. The reader leans in, not away.

White as Material

The background is not empty — it is the primary surface. Space between elements carries as much intention as the elements themselves.

Restrained Tokens

Near-monochrome palette. Minimal spacing scale. Motion so subtle it feels like breathing. The system disappears so the content can exist.

Embrace Your Vision

II. Composition

Type & color.

The specimen. How Edition VOID's typographic voice and color palette work at every scale — from micro-labels to viewport-filling headlines.

Spectral · 200 Italic · Mixed case
Spectral Absence
Negative Space
Void.
Void
Canvas#FAFAF8
Surface#F5F4F2
Depth#EEEDEB
Ink#1A1918
Rule#E2E0DD
Mist#C8C4BC
Invert#0E0E10
HeroVoidSpectral 200 · 5rem
DisplayElegant Display ItalicCormorant Garamond 300i · -0.01em
BodyBody text with generous leading for comfortable reading across long passages.Barlow 300 · 1rem · 1.72 line-height
AccentAccent text for emphasis and key terms.Barlow 400 · color: accent-dk
LinkLinked text with underline offsetBarlow 400 · accent-dk · underline 3px
LabelLABEL TEXTBarlow Condensed 500 · 0.18em · uppercase
RomanIV. MODULARITYBarlow Condensed 500 · gold · 0.18em

Embrace Your Vision

III. Motion

Easing & timing.

Four branded curves. Six duration tokens. The law: animate only transform and opacity. Motion is personality, not decoration. Hover the curves to see each one in action.

Cinematic
[0.16, 1, 0.3, 1]
Alo
[0.22, 0.68, 0, 1.2]
Magnetic
[0.34, 1.56, 0.64, 1]
Reveal
[0.0, 0.0, 0.15, 1]
Fast150ms
Base400ms
Calm600ms
Slow800ms
Stately1000ms
Cinematic1400ms

Live Preview — Hover to experience the motion

Magnetic easing · 600ms · transform only

A system this considered deserves to be experienced, not just described.

Explore the Edition

IV. Modularity

What's inside.

48 components built for Framer with property controls, breakpoint variants, and v7 runtime safety. Token-aware via parseToken — connects to Tokens Studio without configuration.

Navigation
Sticky header, scroll-reveal nav, mega menu, mobile drawer with keyboard support.
6 variants
Heroes
Full-bleed, split, centered, and editorial heroes with parallax and entry animations.
8 variants
Content Blocks
50/50 splits, feature grids, testimonials, and FAQs. CMS-ready with collection bindings.
12 variants
CTAs & Forms
Buttons, input groups, newsletter captures. Approved CTA language built into defaults.
8 variants
Data & Charts
Bar charts, stat counters, metric cards. SVG-based with entrance animations and tooltips.
6 variants
Footers & Dividers
Gallery index footer, whisper dividers, micro-phrase rules, and seal mark variations.
8 variants
48
Components
120+
Tokens
2
Themes
3
Breakpoints

Embrace Your Vision

V. Adaptation

Two themes.
Three breakpoints.

Every component ships with dark and light variants. Tokens Studio sync means switching themes updates every surface, text, and accent in one action.

Dark Mode
Void.
The default atmosphere — surfaces recede, accents emerge, content breathes in darkness.
Light Mode
Void.
Same hierarchy, same components, different atmosphere. Clarity over mood.
1440 × 900
Desktop
≥ 1024px
768 × 1024
Tablet
768 – 1023px
375 × 812
Phone
≤ 767px

Embrace Your Vision

"Every decision in this system was tested against real constraints — contrast ratios, runtime safety, responsive breakpoints. Nothing ships until it passes 169 automated checks."

Alonzo Wright-Bey · AloDesignpros

A. mark

Edition III

$179

One-time · Lifetime updates · Commercial license

48 Components 120+ Tokens Dark + Light 3 Breakpoints v7 Runtime Tokens Studio Figma Source
Request Access
30-day refund guarantee Secure checkout via Gumroad Instant download

FAQ

Common questions.

What exactly do I receive?+

A ZIP file containing 48 Framer Code Components (.tsx), token foundation files (tokenSync.ts, parseToken.ts), Tokens Studio JSON, 6 interaction overrides, 5 interactive demo components, a styles reference, and a setup guide. Everything you need to build a complete site in Framer.

Can I use this for client projects?+

Yes. One license covers unlimited projects for one team (up to 5 people). Use it on as many client sites as you want. You cannot resell the Edition files themselves as a standalone product.

Do I need Tokens Studio?+

No. Components work with hardcoded defaults out of the box. Tokens Studio adds one-click theme switching and design-to-code sync but is completely optional.

What if it doesn't work for me?+

30-day refund, no questions asked. Email alodesignpros@gmail.com within 30 days for a full refund processed within 48 hours.

How do I get updates?+

Lifetime updates via Gumroad. When we add components or fix bugs, you receive an email with a new download link. Your existing Framer project structure stays intact.

How do I get support?+

Email alodesignpros@gmail.com with your Gumroad order number. We respond within 24 hours on business days. Support covers installation, component questions, and bug reports.

Embrace Your Vision