Deep Sky Canvas

Shaders

About

Fullscreen WebGL nebula shader with layered fBm clouds, sparse starfield, and smooth animated color cores

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

Code

How Deep Sky Canvas is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import ShaderComponent  from "@/components/ui/deep-sky-canvas";


export default function App() {
    return (
        <div style={{ margin: 0, padding: 0, overflow: 'hidden', height: '100vh', backgroundColor: '#000' }}>
            <ShaderComponent />
        </div>
    );
}