STATISIO Landing Page - Content & Button Update
A high-impact, brutalist-grunge design system inspired by vintage newsprint and industrial aesthetics. Characterized by a high-contrast palette of newsprint beige and crimson red, it features heavy monospaced typography, grainy overlays, and 'stamped' UI elements. Ideal for disruptive SaaS, edgy marketing agencies, fintech, or any bold brand seeking a raw, editorial feel with modern interactivity. Key features include animated tickers, halftone backgrounds, and stepped scroll animations.
Summary
A brutalist, print-inspired layout that blends industrial textures with high-contrast digital elements. It uses a newsprint background (#F0EAD6), heavy charcoal borders, and crimson accents to create a sense of urgency and authority, perfect for conversion-focused landing pages.
Style
The style is defined by 'Digital Brutalism': sharp edges, 1px/2px solid charcoal borders, and offset solid shadows. Typography pairs the bold, condensed 'Oswald' for headings with 'Roboto Mono' for technical labels and 'DM Sans' for body text. Texture is central, using a global SVG grain filter and halftone patterns to mimic physical print.
Layout & Structure
A vertical-scrolling layout segmented by thick 4px horizontal borders and animated marquee banners. Sections alternate between light newsprint and dark industrial backgrounds, using 'torn' edge masks for transitions.
Sticky Header
Ticker Banners
Hero Section
Comparison Section
Feature Grid
Components
Stamp Button
A button that looks like a physical ink stamp with a solid depth shadow.
Torn Edge Divider
Transition between sections using a jagged, ripped paper effect.
Glitch Reveal Animation
Scroll-triggered reveal using opacity and a quick color-split shadow glitch.