Components
effect with a new one called "SDF Dreamscape," which uses signed distance functions (SDFs) to render a dynamic, fractal-like landscape with intricate details and a more sophisticated color palette. The UI controls have been re-mapped to control different aspects of this new scene

import ShaderComponent from "@/components/ui/sdf-dreamscape";
const settings = {
hue: 180,
speed: 0.4,
intensity: 5,
complexity: 2.5,
};
export default function Demo(props: Partial<typeof settings>) {
const s = { ...settings, ...props };
return (
<div className="h-screen w-screen">
<ShaderComponent {...s} />
</div>
);
}