{"_id":"@crazygl/hero-cyber-terminal","_rev":"2-d04862bd524fee66a0ad510a7862f782","name":"@crazygl/hero-cyber-terminal","dist-tags":{"latest":"0.1.1"},"versions":{"0.1.0":{"name":"@crazygl/hero-cyber-terminal","version":"0.1.0","author":{"name":"ybouane"},"license":"Apache-2.0","_id":"@crazygl/hero-cyber-terminal@0.1.0","maintainers":[{"name":"ybouane","email":"ybouane@ybouane.com"}],"homepage":"https://crazygl.com/hero/cyber-terminal","bugs":{"url":"https://github.com/crazygl-com/hero-cyber-terminal/issues"},"dist":{"shasum":"7c87e05f4fa00dc1ca965c9fc17c93bf69423b91","tarball":"https://registry.npmjs.org/@crazygl/hero-cyber-terminal/-/hero-cyber-terminal-0.1.0.tgz","fileCount":11,"integrity":"sha512-QTOxsN+2QjIDjEZVQfsNhN4e3fhW7H3ONpHk3kdiOXTFaAhw0IJu7kKeQmFom6DYjBdFKCCJ+V8iIPFC2glD8g==","signatures":[{"sig":"MEQCIGd1u3O7lXVNBr25XmZCGNWb07vY6aPWWu0bZFEuCPx3AiB6tzrlZKw+vg173YjCs9YwMbarJaw/j3bGAl8BTtUGmA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":93597},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./style.css":"./style.css","./metadata.json":"./metadata.json"},"gitHead":"11c361ae747fc5377468405bd1c38d3b4bd60cf1","_npmUser":{"name":"ybouane","email":"ybouane@ybouane.com"},"repository":{"url":"git+https://github.com/crazygl-com/hero-cyber-terminal.git","type":"git"},"_npmVersion":"11.12.0","description":"Cyber Terminal — a terminal/code-editor screenshot floats in 3D, surrounded by animated command fragments, glowing syntax particles, and a pointer cursor trail.","directories":{},"_nodeVersion":"24.14.0","dependencies":{"three":"^0.160.0","@crazygl/core":"^0.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"peerDependencies":{"react":">=18","react-dom":">=18"},"_npmOperationalInternal":{"tmp":"tmp/hero-cyber-terminal_0.1.0_1782870843733_0.2378462195784541","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@crazygl/hero-cyber-terminal","version":"0.1.1","description":"Cyber Terminal — A terminal/code-editor screenshot floats at the centre, surrounded by drifting command fragments, glowing syntax particles and a pointer-driven matrix-green cursor trail. A customizable CrazyGL animated hero section — WebGL, React, drop-i","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/cyber-terminal","repository":{"type":"git","url":"git+https://github.com/crazygl-com/hero-cyber-terminal.git"},"publishConfig":{"access":"public"},"keywords":["terminal","code","developer","matrix","particles","screenshot","three","cli","hacker","devtools","cyber-terminal","crazygl","hero","hero-section","webgl","react","animation","ui","landing-page","interactive","frontend","component","canvas"],"bugs":{"url":"https://github.com/crazygl-com/hero-cyber-terminal/issues"},"gitHead":"bc05f47fafff4695e21c035d2be86683b86b097f","_id":"@crazygl/hero-cyber-terminal@0.1.1","_nodeVersion":"24.14.0","_npmVersion":"11.12.0","dist":{"integrity":"sha512-dinOGQsTGothm6UHiXbMlYiwU8w6ArZGIYhARNbWMfbjxCK9HExBCz1BHS7HhTOiZ94O9I5/vHT8f2MogzPhkQ==","shasum":"56f717a7cf56d4b6bbfc3455415cc44b9c019ef9","tarball":"https://registry.npmjs.org/@crazygl/hero-cyber-terminal/-/hero-cyber-terminal-0.1.1.tgz","fileCount":11,"unpackedSize":94108,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIC6TRGwzP4uognSlg4lrLQ/kKyiAOnLtr4JmAAudx9ngAiEAlz6xX2t2s5hyrDSpboVYEzy7BdYNZgWTIxh1vMowtH4="}]},"_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-cyber-terminal_0.1.1_1782922296111_0.0778047157463797"},"_hasShrinkwrap":false}},"time":{"created":"2026-07-01T01:54:03.562Z","modified":"2026-07-01T16:11:36.399Z","0.1.0":"2026-07-01T01:54:03.876Z","0.1.1":"2026-07-01T16:11:36.259Z"},"bugs":{"url":"https://github.com/crazygl-com/hero-cyber-terminal/issues"},"author":{"name":"ybouane"},"license":"Apache-2.0","homepage":"https://crazygl.com/hero/cyber-terminal","repository":{"type":"git","url":"git+https://github.com/crazygl-com/hero-cyber-terminal.git"},"description":"Cyber Terminal — A terminal/code-editor screenshot floats at the centre, surrounded by drifting command fragments, glowing syntax particles and a pointer-driven matrix-green cursor trail. A customizable CrazyGL animated hero section — WebGL, React, drop-i","maintainers":[{"name":"ybouane","email":"ybouane@ybouane.com"}],"readme":"<sub>*Hero made by [@ybouane](https://x.com/ybouane).*</sub>\n<p align=\"center\">\n  <img src=\"https://crazygl.com/heroes/hero-cyber-terminal/banner-full.png\" alt=\"Cyber Terminal\" width=\"640\">\n</p>\n\n# @crazygl/hero-cyber-terminal\n\nA terminal/code-editor screenshot floats at the centre, surrounded by drifting command fragments, glowing syntax particles and a pointer-driven matrix-green cursor trail.\n\n## Demo\n[Cyber Terminal](https://crazygl.com/hero/cyber-terminal)\n\n## Install\n\n```bash\nnpm install @crazygl/hero-cyber-terminal\n```\n\n## Usage\n\n```tsx\nimport CyberTerminal from '@crazygl/hero-cyber-terminal';\n\nexport default function Page() {\n  return (\n    <CyberTerminal\n      screenshot=\"/screenshots/terminal-dark.avif\"\n      screenshotTilt={-8}\n      fragmentCount={22}\n      particleCount={300}\n    />\n  );\n}\n```\n\n## Customise\n\n- **Content** — `heading`/`subheading`, two-column, or custom node.\n- **Screenshot** — `screenshot` URL, `screenshotX`/`screenshotY`, `screenshotScale`, `screenshotTilt`, `screenEmissive`.\n- **Command fragments** — `fragmentCount`, `commands` (one per line), three palette colours, `fragmentSpeed`.\n- **Particles** — `particleCount`, three palette colours, `particlePull` (attraction toward the screen).\n- **Cursor trail** — `cursorTrailEnabled`, `cursorTrailColor`, `cursorTrailLength`.\n- **Atmosphere / Motion** — `haloColor`/`haloStrength`, `bgColor`, `gridStrength`, `transparentBackground`, `parallaxStrength`.\n\n## Inputs you can plug in\n\n- **Screenshot** — any JPG / PNG / WebP / AVIF. Looks best with terminal or code-editor captures; native aspect is preserved.\n\n## Best for\n\n- Developer tools, APIs, hosting and deployment platforms\n- CLI products and observability dashboards\n- AI/automation SaaS wanting a hacker-but-polished vibe\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","keywords":["terminal","code","developer","matrix","particles","screenshot","three","cli","hacker","devtools","cyber-terminal","crazygl","hero","hero-section","webgl","react","animation","ui","landing-page","interactive","frontend","component","canvas"]}