Skip to content

Page block / PARTICLE

Butterfly Particle Hero

A butterfly-particle hero composition for technology brands and visual storytelling.

Butterfly Particle Hero preview cover

Static preview is active. You can choose to enable motion.

Loading external demo. You can also open it in a new window.

Open original demo

About this resource

Butterfly Particle Hero

A butterfly-particle hero composition for technology brands and visual storytelling.

How to use it

Open the original demo and inspect its interaction. Copy the selection reference into Creght AI and describe your brand, copy and placement so AI can read and adapt the referenced block.

Resource boundaries

This is a reusable hero block, not a complete website template. The external demo does not use native preview controls. Open the original in a new window if embedding is unavailable, and check mobile, reduced motion and text contrast before publishing.

Your website starting point

# Talizen Template Selection Reference

This is a selected section from template site p35l7ulpwviq. Paths beginning with /tpl/ are in a read-only virtual directory.
Use the list_files / read_file / grep_file tools to read the template source as needed; the full source does not need to be included in this message.
Important: list_files or grep_file with path=/ does not include template files; this does not mean they are absent. To search this template, explicitly set path to /tpl/p35l7ulpwviq.

## Selected Element
- Source location: /tpl/p35l7ulpwviq/components/sections/hero/hero-02/hero-02.tsx
- Component chain (inner to outer): /tpl/p35l7ulpwviq/components/sections/hero/hero-02/hero-02.tsx
- Files actually used to render this selection (including implicit dependencies; read as needed):
  - /tpl/p35l7ulpwviq/components/sections/hero/hero-02/hero-02.tsx
  - /tpl/p35l7ulpwviq/talizen.config.ts
  - /tpl/p35l7ulpwviq/index.css
  - /tpl/p35l7ulpwviq/components/sections/effects/particle/ParticleCanvas.tsx
  - /tpl/p35l7ulpwviq/components/sections/effects/particle/shaders.ts
- Dependencies: lucide-react, react, three

You can select and copy this prompt manually. Temporary preview settings do not automatically update the prompt.

Keep exploring

View all

Render diagnostics