Aurora Veil Shader

Heroes 83

About

A lightweight single-draw WebGL shader background that renders soft animated aurora color fields, used as a backdrop behind hero copy, cards, or onboarding sections.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Aurora Veil Shader to your project and fits it to your theme.

Code

How Aurora Veil Shader is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

"use client";

import ShaderAuroraVeil from "@/components/ui/shader-aurora-veil";

export default function ShaderAuroraVeilDemo() {
  return (
    <div className="relative h-screen w-full">
      <ShaderAuroraVeil
        preset="aurora-veil"
        tone="dark"
        className="absolute inset-0 h-full w-full"
      />
    </div>
  );
}