# Design Language for sunhan.church ## Aesthetics and Tone Minimalist sanctuary lit by the aurora — a serene full-bleed nave where the only "stained glass" is a digital gradient that drifts across hand-quarried marble. The page reads as a contemplative meditation: huge negative space, a luminous gradient sky overhead, a slow page-breath. Inspiration: Tadao Ando's Church of the Light, Peter Zumthor's Therme Vals, the aurora-spectrum installations of Olafur Eliasson, and the marble-table tech demos of Apple's keynote stages. The tone is playful — not solemn — because joy is the chosen mood here: small tech-motifs (a circuit-line bird, a soft wifi-glow halo) appear unexpectedly as the page rewards patient looking. Calm but mischievous. Light, not heavy. ## Layout Motifs and Structure Full-bleed composition: the entire viewport is a single canvas. No card-grid, no columns, no sidebars. The hero is the page is the hero. Sections are not boxed; they are luminous regions of the same vast canvas, separated by gentle aurora-band gradients that draw left-to-right at section transitions. Type sits at varying anchor-points across the canvas — a single 8vw display line at upper-right, a small caption at lower-left, a centered scripture verse, never in a column. Stagger pattern triggers as the page enters each section: micro-elements (a date glyph, a halo SVG, a script tag) fade-in with 90ms inter-element delay along a diagonal that follows the aurora's current arc. Marble plinths anchor each section as floor-mounted slabs, holding small tech-motif sculptures: a circuit-line dove, a wireframe pavilion, a thin halo. The whole arrangement reads like an installation walkthrough, not a website. ## Typography and Palette - **Display:** "Inter" (Google Fonts) — geometric-sans variable, weight 200 at 12vw for serene display lines - **Body:** "Manrope" (Google Fonts) — geometric-sans, weight 300 at 18px line-height 1.8 - **Caption / verse:** "Cormorant Garamond" (Google Fonts) — italic for scripture and reflection verses - **Micro / date:** "Space Grotesk" (Google Fonts) — at 12px for date glyphs and service codes Palette — Aurora-gradient sanctuary: - `#F4F7FB` Snow Marble — main background, the marble floor - `#1E3A8A` Twilight Indigo — base aurora-stop - `#7C3AED` Violet Spectrum — mid aurora-stop - `#22D3EE` Cyan Halo — top aurora-stop - `#FFFFFF` Pure Light — type and halo glow - `#0F172A` Granite Plinth — body text and floor-stone shadow ## Imagery and Motifs - **Marble-texture**: Carrara-white marble slabs as the floor plinths beneath each section's tech-motif sculpture. Textures are subtle: gentle gray veining, no high contrast, all in cool gray-blue - **Tech motifs**: circuit-line doves, wireframe pavilions, single-trace halos, wifi-glow arcs, and isometric LED candle silhouettes. Each tech-motif is rendered as a thin (1.5px) Cyan-Halo line drawing, accompanied by a faint Violet-Spectrum glow - Aurora bands: long horizontal gradient ribbons drift slowly across the page at 18s cycles, modulating opacity 0.3–0.6 - Recurring "halo" device: a single thin SVG circle with a soft gradient stroke appears above each section's title, calibrated 1° off-center as a small visual blessing - A delicate constellation of stars drawn in tiny Cyan-Halo dots appears in the upper canvas of each section ## Prompts for Implementation - The page renders as a single full-bleed canvas, no `max-width` constraints. Content sits absolutely positioned at varied anchor points (top-right 12% in, bottom-left 8% in, center 50/50, etc.) - Aurora-gradient: a `` element fixed-positioned behind all content, animated via WebGL or 2D canvas, drifting a 3-stop gradient (Twilight Indigo → Violet Spectrum → Cyan Halo) horizontally with sine-wave modulation - Stagger pattern: each section's micro-elements fade-in with 90ms staggered delay along a diagonal anchored to the current aurora-arc position - Marble plinths: SVG `feTurbulence` with very low baseFrequency (0.02) tinted in Snow Marble, with subtle vein detail at 8% opacity - Tech-motif sculptures: each section holds one inline SVG "sculpture" centered on its marble plinth — 1.5px Cyan-Halo stroke + soft drop-shadow in Violet-Spectrum - AVOID: pricing tiers, CTA bars, prayer-form modals, donation modules. Replace any "engagement" surface with quiet scripture or installation captions - The display type breathes: lines float at 8–12vw, weight 200, with letter-spacing 0.02em — never bold, never urgent - Halo glyphs: thin SVG circles with 1.2px gradient strokes (transparent → Cyan-Halo → transparent), positioned 12px above section titles ## Uniqueness Notes - Differentiator 1: minimalist sanctuary executed with full aurora-gradient sky — most minimalist church sites are bone-white silent; this one breathes color - Differentiator 2: full-bleed canvas avoids the corpus's 90% card-grid trap completely - Differentiator 3: tech-motifs (a category that usually means cyberpunk in the corpus) recast as delicate tech-pastoral: circuit doves, wireframe pavilions - Differentiator 4: aurora-gradient palette anchored to architectural marble — a contemplative tech-gradient rather than rave-gradient - Differentiator 5: playful tone within sanctuary context — the playfulness is the surprise; tech motifs introduce gentle wonder, not solemnity - Chosen seed: aesthetic: minimalist, layout: full-bleed, typography: geometric-sans, palette: aurora-gradient, patterns: stagger, imagery: marble-texture, motifs: tech, tone: playful - Avoids overused patterns: parallax (94%), card-grid (90%), centered (94%), photography (90%), warm palette (93%), mysterious-moody (70%), mono typography (81%)