Butterfly Text

Show Preview
Butterfly Text
Butterfly Text

About Butterfly Text

Bring your typography to life with Butterfly Text, an interactive Framer component that transforms ordinary text into a beautiful landing spot for animated butterflies. Watch colorful butterflies fly in, perch on individual letters, flutter their wings, and respond naturally to cursor movement.

Customize the text, typography, colors, butterfly designs, and flight behavior to create a playful and immersive visual experience. Perfect for adding movement, personality, and a touch of nature to your website.

Features & Customization

  • Custom Text & Typography: Personalize text, fonts, size, and color.

  • Auto-Fit Layout: Automatically adjusts text to fit your design.

  • Butterfly Styles: Choose from different wing shapes and designs.

  • Custom Colors: Adjust wing colors, spots, and body details.

  • Interactive Movement: Make butterflies scatter, follow, and gather around the cursor.

  • Natural Flight: Customize flight speed, movement, resting, and landing behavior.

  • Arrival Styles: Choose between fly-in and already-perched animations.

  • Flexible Controls: Adjust butterfly count, size, spacing, and positioning.

Where to Use

Add a playful touch to creative portfolios, agency websites, landing pages, and personal websites. Butterfly Text works especially well in hero sections, headings, and other areas where you want to create a memorable visual moment.

I hope you enjoy using Butterfly Text! For custom components or other Framer-related projects, contact oddframeworks@gmail.com.

From Oddframe

France Property Map
CMS Orbit Carousel
Curve Flow Carousel
Image Ring Gallery

Related Components

Blurred Text Ticker
Clickable Socials
Diagonal Text Reveal
Scroll Text Fade