Standard
Surface Frost
The default card is a thin sheet of ice — transparent enough to see the darkness beneath, with a faint crystalline border that catches light on hover.
Crystalline design system inspired by frozen formations, glaciers, and the geometry of ice
A palette drawn from glacial depths, frost-covered glass, and the pale light filtering through ice. Every tone is cool, every shade recalls frozen water.
Playfair Display for elegant, palatial headings that evoke ice palace grandeur. Inter for crisp, precise body text with the clarity of freshly frozen glass.
Frozen in Perfect Clarity
Ice forms when water molecules slow their motion and lock into a hexagonal crystal lattice. Each snowflake begins as a single frozen droplet, then grows outward in six directions, branching into the intricate dendritic patterns we see on cold mornings. No two crystals encounter the same conditions as they fall, which is why every frost pattern on your window is unique.
The temperature at which ice forms varies with pressure. Pure water can be supercooled to as low as -48.3 degrees Celsius before spontaneous crystallization occurs.
Glaciological Survey Report — February 2026
Light Through Ice
A 4px base unit scaled geometrically. Precise intervals like the regular spacing of ice crystal lattices.
Buttons shaped by ice — solid glacier cores, frosted glass surfaces, and crystalline outlines. A shimmer of light passes across on hover.
Form elements with the precision of ice crystal growth. Frosted backgrounds, sharp focus states, and the faint glow of light through frozen glass.
Content containers that evoke frozen surfaces — from translucent glass panels to faceted crystal structures to deep glacial blocks.
The default card is a thin sheet of ice — transparent enough to see the darkness beneath, with a faint crystalline border that catches light on hover.
Heavy glassmorphism with stronger blur and saturation. Like looking through thick ancient ice with air bubbles trapped inside, distorting what lies beyond.
Clipped corners create the impression of a crystalline facet. No border-radius — just sharp geometric angles like a natural ice crystal viewed under magnification.
Deep within a glacier, centuries of snowfall compress into dense, blue-tinted ice. This variant uses solid, saturated backgrounds from the deep end of the palette.
Status messages with the clarity of ice and the urgency of cracking glaciers. The frosted left border acts as a crystalline indicator.
Ice crystal formation detected on sensor arrays. Current temperature holding at -23 C with 94% relative humidity. Dendritic growth patterns visible on exterior surfaces.
Glacial ice core successfully extracted from depth of 340 meters. Air bubble analysis confirms atmospheric composition from approximately 12,000 years ago.
Thermal sensors indicate subsurface melting at junction point C-7. Ice shelf integrity at 68%. Recommend reinforcing monitoring stations before next thermal cycle.
Seismic monitors detecting rapid fracture propagation along the eastern face. Evacuate observation deck immediately. Estimated mass release: 4.2 gigatons.
Decorative borders inspired by frost creeping across glass, icicles hanging from ledges, and the faceted edges of crystal structures.
A gradient top border that transitions through the ice palette — from pale blue through cyan to frost. Like the thin leading edge of frost spreading across a window pane at dawn.
Fine vertical lines descending from the top edge with a fading mask, suggesting icicles forming along a roofline. Subtle and architectural.
An octagonal clip-path cuts the corners into angled facets, mimicking the way ice crystals fracture along geometric planes. No border-radius needed.
Decorative crystal shapes built with CSS clip-paths. Each form references a real ice crystal habit — hexagonal plates, diamond prisms, and stellar dendrites.
The fundamental shape of ice. Water molecules naturally arrange into six-fold symmetry at standard atmospheric pressure.
Columnar ice crystals viewed along their axis. Found in high-altitude cirrus clouds and ice fog near the ground.
The classic snowflake shape. Branches grow outward from a central plate, forming intricate fractal patterns unique to each crystal.
Three levels of frosted glass intensity, from barely-there condensation to thick ice window panes. Built with backdrop-filter for true translucency against the crystalline background grid.
The faintest breath of frost — a whisper of blur and the slightest tint. Content behind is mostly visible, like early morning condensation just beginning to form.
A proper frosted pane — the world behind is obscured but still present as shapes and colors. Like the ice that forms on single-pane windows in old cabins.
Dense glacial ice that has been compressed for millennia. Almost opaque, with deep blue undertones and strong saturation. Light barely penetrates.
Ice does not curve — it fractures, facets, and angles. Use minimal border-radius. Let clip-paths create the crystalline geometry that soft curves cannot.
Real ice is never fully opaque. Build depth through overlapping translucent surfaces. Backdrop-filter creates the frozen-glass effect that defines this system.
No warmth, no organic softness. Every color is drawn from the blue-cyan spectrum. Spacing is mathematical. Typography is crisp and legible against the frozen backdrop.
Ice catches light in flashes — a shimmer, a glint, a brief refraction. Animations should be slow and understated. The shimmer effect suggests light moving through crystal, not across a screen.