Portfolio system · v1.0
Purpose
This page is the working source of truth for typography, color, spacing, interface components, content patterns, and motion. Use the controls to explore changes. Copy the resulting token block when a direction is ready to become part of the shared stylesheet.
Foundations
Color
Core identity and high-energy accents.
#254441#5D0E41#FFB236#251605#00E2CC#FF1D92#FF5927#F1EDE5Typography
Syne carries identity. Lora carries explanation.
Title XL
Our services
Crafting Digital Experiences
Web Design & Development
Custom e-commerce solutions
Seamless payment integration
Explore more
Design decisions should feel expressive at first glance and remain legible under repeated use. Lora gives long-form case studies a more human rhythm beside Syne’s geometric display voice.
Spacing
A four-pixel base with deliberately large editorial jumps.
4812162432486496Components
Buttons
Square, emphatic, and edged by a second accent color.
Surfaces
Translucent paper for focus; finer glass for preserving live media.
Paper panel
Use over busy backgrounds when long-form reading is the priority.
Glass panel
Use sparingly where the background is part of the story.
Forms
Utility controls use the same square, high-contrast language.
Patterns
Project index
Dense rows for scanning, with color reserved for emphasis.
Case-study rhythm
Alternate immersion, explanation, evidence, and reflection.
Rules
Guardrails that keep future pages related.
Let one expressive visual carry the viewport.
Use cream sheets for sustained reading.
Use accent colors as signals, not wallpaper.
Rounded cards, soft SaaS layouts, and nested panels.
Long display copy set in the body typeface.
Dark overlays that mute the work being presented.