{"_id":"@crazygl/hero-inflatable-balloon-typography","name":"@crazygl/hero-inflatable-balloon-typography","dist-tags":{"latest":"0.1.1"},"versions":{"0.1.1":{"name":"@crazygl/hero-inflatable-balloon-typography","version":"0.1.1","description":"Inflatable Balloon Typography — Your headline becomes a row of soft, puffy balloon letters. Each glyph is inflated outward along its surface normal, floats gently with its own bobbing rhythm, squashes elastically when… A customizable CrazyGL animated hero","type":"module","main":"./dist/index.js","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./metadata.json":"./metadata.json","./style.css":"./style.css"},"dependencies":{"@crazygl/core":"^0.1.1","three":"^0.160.0"},"peerDependencies":{"react":">=18","react-dom":">=18"},"license":"Apache-2.0","author":{"name":"ybouane"},"homepage":"https://crazygl.com/hero/inflatable-balloon-typography","repository":{"type":"git","url":"git+https://github.com/crazygl-com/hero-inflatable-balloon-typography.git"},"publishConfig":{"access":"public"},"keywords":["three","3d","text","typography","balloon","inflatable","playful","saas","consumer","creator","kids","interactive","spring","inflatable-balloon-typography","crazygl","hero","hero-section","webgl","react","animation","ui","landing-page","frontend","component","canvas"],"bugs":{"url":"https://github.com/crazygl-com/hero-inflatable-balloon-typography/issues"},"gitHead":"c78e691f58d07bcdc48f8ea19ed8e01216a0432c","_id":"@crazygl/hero-inflatable-balloon-typography@0.1.1","_nodeVersion":"24.14.0","_npmVersion":"11.12.0","dist":{"integrity":"sha512-Hr9LhRUDWW3OwT7reIQ9d2mfomjAJkfrQR3FZraO0LpPUelRKPLWkWy0KB6HpFb+aivK3t7DE7Xr9/hu7cK7Eg==","shasum":"91e664b23676646e82ea86dfbebfee2bd3c88e14","tarball":"https://registry.npmjs.org/@crazygl/hero-inflatable-balloon-typography/-/hero-inflatable-balloon-typography-0.1.1.tgz","fileCount":11,"unpackedSize":80755,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDC8+YoqowcquDADeXHKOxyGoz0MUQ0Pa4JeKVLmXw4ewIgOTjahbfSWpz9UwIzi7H1HlEYpLzeu5Z+B35Cz1aZaN0="}]},"_npmUser":{"name":"ybouane","email":"ybouane@ybouane.com"},"directories":{},"maintainers":[{"name":"ybouane","email":"ybouane@ybouane.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/hero-inflatable-balloon-typography_0.1.1_1782922368161_0.2218628402250522"},"_hasShrinkwrap":false}},"time":{"created":"2026-07-01T16:12:48.051Z","0.1.1":"2026-07-01T16:12:48.306Z","modified":"2026-07-01T16:12:48.535Z"},"maintainers":[{"name":"ybouane","email":"ybouane@ybouane.com"}],"description":"Inflatable Balloon Typography — Your headline becomes a row of soft, puffy balloon letters. Each glyph is inflated outward along its surface normal, floats gently with its own bobbing rhythm, squashes elastically when… A customizable CrazyGL animated hero","homepage":"https://crazygl.com/hero/inflatable-balloon-typography","keywords":["three","3d","text","typography","balloon","inflatable","playful","saas","consumer","creator","kids","interactive","spring","inflatable-balloon-typography","crazygl","hero","hero-section","webgl","react","animation","ui","landing-page","frontend","component","canvas"],"repository":{"type":"git","url":"git+https://github.com/crazygl-com/hero-inflatable-balloon-typography.git"},"author":{"name":"ybouane"},"bugs":{"url":"https://github.com/crazygl-com/hero-inflatable-balloon-typography/issues"},"license":"Apache-2.0","readme":"<sub>*Hero made by [@ybouane](https://x.com/ybouane).*</sub>\n<p align=\"center\">\n  <img src=\"https://crazygl.com/heroes/hero-inflatable-balloon-typography/banner-full.png\" alt=\"Inflatable Balloon Typography\" width=\"640\">\n</p>\n\n# @crazygl/hero-inflatable-balloon-typography\n\nYour headline becomes a row of soft, puffy balloon letters. Each glyph is inflated outward along its surface normal, floats gently with its own bobbing rhythm, squashes elastically when your cursor gets close, and ripples in a bounce wave when you click anywhere on the canvas.\n\n## Demo\n[Inflatable Balloon Typography](https://crazygl.com/hero/inflatable-balloon-typography)\n\n## Install\n\n```bash\nnpm install @crazygl/hero-inflatable-balloon-typography\n```\n\n## Usage\n\n```tsx\nimport InflatableBalloonTypography from '@crazygl/hero-inflatable-balloon-typography';\n\nexport default function Page() {\n  return (\n    <InflatableBalloonTypography\n      heading=\"Squishy\"\n      inflateAmount={0.7}\n      textColor=\"#ff6fb0\"\n    />\n  );\n}\n```\n\n## Customise\n\n- **Content** — `heading` (one short word balloons best), `subheading`, `ctaLabel`/`onCTAClick`/`ctaTextColor`/`ctaBgColor`.\n- **Geometry** — `extrudeDepth` (letter thickness), `bevelSize`, `inflateAmount` (0 = flat extrusion, 1 = fully blown-up balloon), `letterSpacing`.\n- **Motion** — `floatAmplitude`/`floatSpeed` (per-letter bob), `squashStrength`/`squashSpringStiffness` (cursor squash), `bounceWaveStrength`/`bounceWaveSpeed` (click ripple).\n- **Material** — `textColor`, `sheenColor`, `clearcoat`, `roughness`.\n- **Lighting** — `keyLightIntensity`, `envIntensity` (studio reflection).\n- **Background & type** — `transparentBackground`, `bgTop`/`bgBottom`, `headingFontFamily`, `headingFontWeight` (the balloons extrude this font's real glyphs).\n\n## Best for\n\n- Consumer apps and playful SaaS launch pages\n- Creator tools and kids' or education brands\n- Candy and DTC e-commerce product pages that want warmth over polish\n\n\n\nThis hero is part of [CrazyGL](https://crazygl.com), a collection of production-ready WebGL, canvas, 3D, and typography effects. Every CrazyGL hero ships with an agent-ready `SKILL.md` file that helps developers and coding agents adapt the effect into custom landing pages and interactive experiences.\n","readmeFilename":"README.md","_rev":"1-56556cbdacf8edd254fa33233fa95444"}