Morphism Pixel Landing Page Prompt

assetactive

Morphism Pixel Landing Page Prompt

Source: morphism-pixel-landing-page-prompt.md (ingested 2026-03-28)

Build a mobile-first landing page with a retro 8-bit / lo-fi pixel UI (pixel windows, chunky borders, pixel icons, blocky type) but with Morphism’s purple look. Palette:

  • bg: #05010A
  • violet: #7C3AED
  • purple: #A855F7
  • magenta: #D946EF
  • text: #F5F3FF
  • muted: rgba(245,243,255,0.65)
  • border: rgba(168,85,247,0.35) Background:
  • full-screen purple mesh gradient (multiple radial gradients), subtle animated drift, light grain/noise overlay, optional dithering texture. Components:
  • “pixel window” cards with 12px radius, 2–3px pixel-style border in violet, inner shadow, dark translucent fill (rgba(10,5,20,0.65)). Typography:
  • pixel font for headings (Press Start 2P or similar), clean sans for body if needed. Interactions:
  • pixel button with violet fill + bright edge highlight, hover/press offsets like a game UI. Layout:
  • vertical story panels like the screenshot (message at top, pixel window scene, caption box, ‘Swipe up or Tap’ at bottom). Keep everything accessible: ensure contrast and legibility over the mesh background. Use Tailwind + CSS variables for theming.