Backgrounds
webgl
experimental

Imposter Syndrome Shader

An atmospheric interactive sky shader with clouds, sun, moon, rain, aurora, and weather effects.

Customize

Open the preview to interact with the original Shadertoy shader and drag the sun across the sky.

Props

NameTypeDefault
className

Optional wrapper classes.

string

Install

Add the component directly to your configured component directory.

terminal
pnpm dlx shadcn@latest add https://awwwardedui.vercel.app
/r/imposter-syndrome-shader.json

Usage

terminal
import { ImposterSyndromeShader } from "@/components/ui/imposter-syndrome-shader"

<ImposterSyndromeShader />

Implementation prompt

A ready-to-use integration brief for a coding agent.

Install and integrate the Imposter Syndrome Shader component from the AwwwardWinning UI shadcn registry.

Use the provided registry command and preserve the component inside the project's configured component directory.

Integration requirements:
- Replace the demo content with content already present in the application.
- Preserve the application's typography, colors, spacing, and border-radius tokens.
- Place the component inside a relative, overflow-hidden hero or atmospheric feature section.
- Preserve semantic HTML and keyboard accessibility.
- Do not introduce global styles, fixed IDs, or unnecessary dependencies.
- Do not rebuild unrelated sections of the page.
- Keep the component responsive and respect reduced-motion preferences.
- Confirm the registry component installed successfully before integration.

Registry command:
pnpm dlx shadcn@latest add https://awwwardedui.vercel.app
/r/imposter-syndrome-shader.json

Dependencies

None

Touch

full

Motion

Reduced-motion support

Shader reference: “Imposter Syndrome” by stilltravelling on Shadertoy.