50:I[267044,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/15s1ft4k9lx-7.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/3ohf-5_4hfjuq.js","/creators-assets/_next/static/immutable/chunks/2jjhfe7-w6y9a.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/2y9gv91n8o3i9.js","/creators-assets/_next/static/immutable/chunks/3z6ke99nzr4_e.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/1fkcqskfw4hol.js","/creators-assets/_next/static/immutable/chunks/3ixl4aqv6ylo7.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/2di2v55rtz-8i.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/00owjoob9gqs9.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js"],"S"] 51:T54d,

About this Component

Bring your headlines into a bold 3D typographic loop. Split Text Tube turns characters into layered rotating lines, creating a tube-like motion effect perfect for hero titles, posters, portfolio intros, and experimental typography.

✨ 3D Character Reveal Each letter animates through perspective, depth, and rotation for a dimensional text effect that feels physical and kinetic.

Split character animation - every character moves independently for a rich motion sequence.

Tube-style line stacking - duplicate lines create a rotating dimensional type system.

Perspective controls - adjust depth and camera feel directly in Framer.

Loop-ready motion - create continuous animated headline moments.

🌀 Full Typography Control Customize text, font, color, line count, duration, stagger, rotation angles, background, and accessibility label.

Bug Report - Please mail at aashayagrawal.work@gmail.com

52:T698,

Details

Center Underline allows you to create polished text hover states with multiple underline animation styles.
The underline can expand from the center, enter from one side and exit from the other, or start visible and animate out on hover.
This makes it flexible enough for both subtle interface details and more expressive typographic interactions.

Key Features

Custom text input
Extended font controls
Custom text color
Custom underline color
Three animation styles
Left and right direction control
Adjustable animation duration
Multiple easing options
Adjustable underline height
Adjustable underline spacing
Auto-width and auto-height layout support
Lightweight Framer Motion animation

Animation Styles

Center
- The underline expands smoothly from the center on hover.
Comes In, Goes Out
- The underline enters from one direction and exits from the opposite direction.
Goes Out, Comes In
- The underline starts visible and disappears on hover with directional motion.

---

Property Controls

53:T78d,

About this Component

Details

Letter Swap is a text animation component that swaps individual letters vertically on hover.
It creates the effect by duplicating the text, splitting it into individual characters, and animating each letter inside an overflow-hidden container.
The component supports two animation modes: Forward and Ping Pong.
Forward animation plays the letter swap once when the user hovers over the text.
Ping Pong animation plays forward on hover and reverses when the user moves away.
It is ideal for interactive links, menus, buttons, headings, portfolio websites, landing pages, and refined typography details.

Key Features

Custom text label
Vertical letter-swap animation
Forward animation mode
Ping Pong animation mode
Reverse direction control
Custom transition settings
Adjustable stagger duration
Stagger from first, center, last, or custom index
Supports additional CSS classes
Click event support
Smooth hover-based interaction
Accessible hidden text label support

Animation Styles

1.Forward

Plays the animation once on hover.
Best for quick, expressive hover interactions.

2.Ping Pong

Animates forward on hover and reverses on hover out.
Best for links, menus, and interactive UI text that needs a responsive hover state.

---

Property Controls

4f:["$","$L50",null,{"value":{"fallback":{"$inf$activity-creator-d8115888-5d3c-4419-844c-e2bfd2c6f173-all:/unified/creator/d8115888-5d3c-4419-844c-e2bfd2c6f173/activity/":[{"data":[{"id":"019ffb0b-187c-70fd-bc1a-9eea326ccd01","type":"comment.reply","target":{"type":"post","id":"019e7962-bb6e-70c9-a430-0bf14d8aa075","preview":"Underline Motion","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/V7sAUF9QjZZr86xax683/underline-motion-fliycD0BKMUtSBTNsExt7n8vBx11Lp","targetDeleted":false,"owned":true,"actions":{"postId":"019e7962-bb6e-70c9-a430-0bf14d8aa075","like":{"count":20,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"context":{"type":"comment","id":"019ffb0b-1862-74ee-904b-538e33093e31","preview":"hey just add a stack in the component and add link to that stack.","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"hey just add a stack in the component and add link to that stack."}]}]},"thumbnail":null,"targetDeleted":false,"owned":true,"actions":{"postId":"019e7962-bb6e-70c9-a430-0bf14d8aa075","like":{"count":0,"liked":false},"reply":{"parentCommentId":"019ff65d-8042-76f3-940d-56567c63bf68"},"repost":null}},"actors":[{"id":"d8115888-5d3c-4419-844c-e2bfd2c6f173","name":"Aashay Agrawal","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d8115888-5d3c-4419-844c-e2bfd2c6f173/u0bb8j1n","slug":"aashayagrawal","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-13T12:13:56.220Z","latestAt":"2026-08-13T12:13:56.220Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}],"$inf$posts:d8115888-5d3c-4419-844c-e2bfd2c6f173:/unified/posts/?creator=d8115888-5d3c-4419-844c-e2bfd2c6f173&with=reposts":[{"data":[{"id":"019e9d3d-ec84-777c-9754-4c3facaf96fb","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d8115888-5d3c-4419-844c-e2bfd2c6f173","name":"Aashay Agrawal","slug":"aashayagrawal","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d8115888-5d3c-4419-844c-e2bfd2c6f173/u0bb8j1n","followed":false,"followsYou":false},"media":[],"resources":[{"id":"Cn369lUC8Vfdzg60W9UT","resolved":true,"title":"Text Rotar","body":"$51","bodyJson":null,"introduction":"3D tube-style text animation","slug":"text-rotar","author":{"framerUserId":"d8115888-5d3c-4419-844c-e2bfd2c6f173","name":"Aashay Agrawal","slug":"aashayagrawal","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d8115888-5d3c-4419-844c-e2bfd2c6f173/u0bb8j1n","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/Cn369lUC8Vfdzg60W9UT/text-rotar-g83or3nAdKfj5Lc9bDTxYrOygQS1co","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-06-02T18:56:40.457Z","updatedAt":"2026-06-12T20:38:59.565Z","publishedAt":"2026-06-06T14:02:21.700Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://hy.chujiqiqi.com/m/TextRotar-UKTeqY.js@a4n9Q51DRTP88V1dFIrH","previewUrl":"https://split-text-tube.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"7fe42fdd-1b16-4f5a-93b8-009488614de8","name":"Text","slug":"text"}],"lastSaveId":"a4n9Q51DRTP88V1dFIrH","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":12,"liked":false},"comments":{"count":1},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-06-06T14:02:21.700Z","updatedAt":"2026-06-06T14:02:21.700Z"},{"id":"019e7962-bb6e-70c9-a430-0bf14d8aa075","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d8115888-5d3c-4419-844c-e2bfd2c6f173","name":"Aashay Agrawal","slug":"aashayagrawal","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d8115888-5d3c-4419-844c-e2bfd2c6f173/u0bb8j1n","followed":false,"followsYou":false},"media":[],"resources":[{"id":"V7sAUF9QjZZr86xax683","resolved":true,"title":"Underline Motion","body":"$52","bodyJson":null,"introduction":"Hover underline text animation","slug":"underline-motion","author":{"framerUserId":"d8115888-5d3c-4419-844c-e2bfd2c6f173","name":"Aashay Agrawal","slug":"aashayagrawal","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d8115888-5d3c-4419-844c-e2bfd2c6f173/u0bb8j1n","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/V7sAUF9QjZZr86xax683/underline-motion-fliycD0BKMUtSBTNsExt7n8vBx11Lp","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-05-20T19:09:40.312Z","updatedAt":"2026-06-16T18:38:25.436Z","publishedAt":"2026-05-30T14:56:14.190Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://hy.chujiqiqi.com/m/UnderlineTextAnimation-ZCetCi.js@wBpubVDSwG8hRH8bUcPl","previewUrl":"https://underlinetextanimation.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"7fe42fdd-1b16-4f5a-93b8-009488614de8","name":"Text","slug":"text"}],"lastSaveId":"wBpubVDSwG8hRH8bUcPl","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":20,"liked":false},"comments":{"count":2},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-05-30T14:56:14.190Z","updatedAt":"2026-05-30T14:56:14.190Z"},{"id":"019e7962-adc4-7ae9-a63d-99cafa03b92b","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d8115888-5d3c-4419-844c-e2bfd2c6f173","name":"Aashay Agrawal","slug":"aashayagrawal","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d8115888-5d3c-4419-844c-e2bfd2c6f173/u0bb8j1n","followed":false,"followsYou":false},"media":[],"resources":[{"id":"N2ci2IZD0KRoOaA3U2u0","resolved":true,"title":"LetterSwap","body":"$53","bodyJson":null,"introduction":"letter hover animation","slug":"letterswap","author":{"framerUserId":"d8115888-5d3c-4419-844c-e2bfd2c6f173","name":"Aashay Agrawal","slug":"aashayagrawal","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d8115888-5d3c-4419-844c-e2bfd2c6f173/u0bb8j1n","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/N2ci2IZD0KRoOaA3U2u0/letterswap-ZCEnww5EVOdxI8orsPCIs7L8c6tQVJ","metadata":{"tint":{"h":0,"s":0,"l":9},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-05-25T12:44:54.446Z","updatedAt":"2026-05-30T17:08:15.202Z","publishedAt":"2026-05-30T14:56:10.692Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://hy.chujiqiqi.com/m/LetterSwap-OK1B2r.js@BHQ5m1AKarM2EOWid1Sz","previewUrl":"https://letterswap.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"7fe42fdd-1b16-4f5a-93b8-009488614de8","name":"Text","slug":"text"}],"lastSaveId":"BHQ5m1AKarM2EOWid1Sz","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":5,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-05-30T14:56:10.692Z","updatedAt":"2026-05-30T14:56:10.692Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}]}},"children":"$L54"}]