Simpleton Framework
Signature Elements
Simpleton includes a small collection of signature design elements that help create a polished, cohesive visual identity while remaining easy for child themes to customize.
Accent Bar
The accent bar is one of Simpleton's defining visual elements. By default it appears at the top of the site header and can also be used throughout the site to visually connect important sections.
The appearance of the accent bar is controlled entirely by the active child theme through CSS variables.
Hero Panel
The hero panel extends the accent bar into featured content areas, creating a visual connection between the page header and the page content.
Featured Section
Simpleton Hero Panel
This panel demonstrates the built-in hero treatment using the framework's signature accent bar.
Nested Hero Panel
Hero panels can also contain other framework components.
Everything Works Together
Panels, callouts, buttons, and typography all work naturally inside the hero panel.
Information
Child themes may dramatically change the visual appearance while preserving the same HTML structure.
Theme Identity
Simpleton
Blue gradient accent. Minimal styling. Clean foundation.
BLOKS
Blue glow. Dark cinematic styling. Futuristic presentation.
Pride
Rainbow gradient. Bright personality. Inclusive branding.
Framework Philosophy
A framework should provide recognizable structure without dictating visual identity.
The accent bar and hero panel demonstrate this philosophy. Every child theme can reinterpret these signature elements while maintaining a consistent underlying framework.