Skip to content

Add animated background with gradient orbs #19

Description

@Muneerali199

Summary

Create a subtle animated background component with floating gradient orbs for visual depth.

Tasks

  • Create components/animated-background.tsx with:
    • 3-4 gradient orbs that float and pulse slowly
    • Soft blur on each orb
    • Colors derived from the brand palette (amber, green, blue)
    • pointer-events-none so they don't block interaction
  • Integrate into app/layout.tsx as a background layer

Files to change

  • components/animated-background.tsx (new, ~100 lines)
  • app/layout.tsx (~5 lines added)

Acceptance criteria

  • Orbs animate smoothly without impacting performance
  • Content remains readable on top
  • npm run build succeeds

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Fields

No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions