{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"liquid-form","type":"registry:item","title":"Liquid Form","description":"A centered silver ray-marched liquid form with authored studio reflections and pointer-responsive camera drift.","files":[{"path":"snippets/liquid-form.tsx","content":"import { LiquidFormBackground } from \"@designcodeio/threeui\";\nimport \"@designcodeio/threeui/style.css\";\n\n// The component fills its parent, so the parent is what gives it a size.\nexport function LiquidFormBackgroundExample() {\n  return (\n    <div style={{ width: \"100%\", aspectRatio: \"16 / 9\" }}>\n      <LiquidFormBackground />\n    </div>\n  );\n}\n","type":"registry:file","target":"~/snippets/liquid-form.tsx"}],"docs":"## Size\n\nThe component is 100% of its parent's width and height and has no size of its own, so a\nparent with no height renders nothing. A box at a 16 to 9 ratio suits it.\n\n## Props\n\nAll optional. The defaults below are what the snippet renders.\n\n| Prop          | Values     | Default |\n| ------------- | ---------- | ------- |\n| `speed`       | 0 to 2     | `1`     |\n| `morph`       | 0 to 2     | `1`     |\n| `noiseScale`  | 0.4 to 2.5 | `1`     |\n| `mouseAmount` | 0 to 0.4   | `0.15`  |\n| `metal`       | 0.3 to 1.8 | `1`     |\n| `camera`      | 4 to 7     | `5.5`   |\n| `tintHue`     | 0 to 360   | `220`   |\n| `tintAmount`  | 0 to 1     | `0`     |\n\n`className` passes through to the root element.\n","author":"mengto","dependencies":["@designcodeio/threeui"]}