Cursor Maze: Premium Sections Component by Aidan Looker

Turn your site into a destination. Cursor Maze is a fully interactive, canvas-rendered maze game that challenges visitors to navigate from start to finish without touching the walls. Three difficulty levels, procedural generation, and a built-in timer.

What is Cursor Maze?

Cursor Maze is a premium interactive game component that renders a procedurally generated maze directly on your Framer page. Visitors use their cursor to navigate from start to finish, avoiding walls along the way. It features pixel-perfect collision detection, a personal best timer, and a custom cursor with trail effects. Ideal for portfolio sites, agency landing pages, 404 pages, and interactive campaigns.

Core Features

Procedurally generated mazes that randomise on every new game, keeping the challenge fresh for repeat visitors
Three difficulty presets (Easy, Medium, Hard) that control maze density and corridor complexity
High-performance canvas rendering with multi-pass wall effects including ambient glow, beveled highlights, and intersection dots
Pixel-accurate collision detection for smooth 60fps gameplay
Built-in timer with personal best tracking, attempt counter, and cursor trail visualisation
Polished win and game over overlays with glassmorphic card panels and confetti-style particle effects

Controls inside Framer

General

Difficulty — Easy, Medium, or Hard maze density
Title — internal component label
Font — primary typeface for all UI text
Win Message — text shown on maze completion
Lose Message — text shown when a wall is hit

Colors

Background — component background fill
Walls — primary wall colour
Wall Glow — ambient glow around walls
Cursor and Trail — cursor dot and trail colour
Text — UI text and overlay colour

Game Settings

Wall Thickness — wall stroke width in pixels
Cursor Size — custom cursor dot radius
Forgiveness — extra clearance between cursor and walls (higher values make the game easier)
Show Timer — toggle the elapsed time display
Show Trail — toggle the cursor trail effect

Best use cases

Portfolio and agency sites — add a memorable interactive moment that keeps visitors engaged longer
404 and error pages — turn a dead end into a playful experience worth sharing
Landing pages and campaigns — create a unique micro-interaction that differentiates your brand
SaaS onboarding and waitlist pages — give visitors something to do while they wait

Drop it onto any frame. Pick a difficulty. Your visitors get a reason to stay.