Text-effects
84 components
- A headline that leaves trailing echoes as the pointer moves near it, in a chosen tint. React Bits, Text-effects, 0 votes, MIT + Commons Clause License Condition v1.0 licencetext-effects0
React Bits Echo Text
A headline that leaves trailing echoes as the pointer moves near it, in a chosen tint.
React Bitsanimationinteractivereact-bitsMIT + Commons Clause License Condition v1.0 - A layered 3D headline extruded in depth that tilts toward the pointer, in a chosen depth colour. React Bits, Text-effects, 0 votes, MIT + Commons Clause License Condition v1.0 licencetext-effects0
React Bits Depth Text
A layered 3D headline extruded in depth that tilts toward the pointer, in a chosen depth colour.
React Bitsanimationinteractivereact-bitsMIT + Commons Clause License Condition v1.0 - An attributed Decrypted Text reveal with sequential, direction and replay controls, screen-reader text and reduced-motion support. React Bits, Text-effects, 0 votes, MIT + Commons Clause License Condition v1.0 licencetext-effects0
React Bits Decrypted Text
An attributed Decrypted Text reveal with sequential, direction and replay controls, screen-reader text and reduced-motion support.
React Bitsanimationdecrypted-textinteractiveMIT + Commons Clause License Condition v1.0 - A marquee of text flowing along a curved path that can be dragged to change direction. React Bits, Text-effects, 0 votes, MIT + Commons Clause License Condition v1.0 licencetext-effects0
React Bits Curved Loop
A marquee of text flowing along a curved path that can be dragged to change direction.
React Bitsanimationinteractivereact-bitsMIT + Commons Clause License Condition v1.0 - An attributed Count Up metric pair with replay, speed and reduced-motion final values. React Bits, Text-effects, 0 votes, MIT + Commons Clause License Condition v1.0 licencetext-effects0
React Bits Count Up
An attributed Count Up metric pair with replay, speed and reduced-motion final values.
React Bitsanimationinteractivereact-bitsMIT + Commons Clause License Condition v1.0 - A spinning circular badge that reacts on hover by speeding up, slowing down or pausing. React Bits, Text-effects, 0 votes, MIT + Commons Clause License Condition v1.0 licencetext-effects0
React Bits Circular Text
A spinning circular badge that reacts on hover by speeding up, slowing down or pausing.
React Bitsanimationinteractivereact-bitsMIT + Commons Clause License Condition v1.0 - A welcome message whose words or letters animate in from a blur, replayable. React Bits, Text-effects, 0 votes, MIT + Commons Clause License Condition v1.0 licencetext-effects0
React Bits Blur Text
A welcome message whose words or letters animate in from a blur, replayable.
React Bitsanimationinteractivereact-bitsMIT + Commons Clause License Condition v1.0 - A word rendered in three.js and redrawn as live ASCII characters that ripple and follow the pointer, set in a locally bundled IBM Plex Mono, with a choice of words and a waves toggle. React Bits, Text-effects, 0 votes, MIT + Commons Clause License Condition v1.0 licencetext-effects0
React Bits ASCII Text
A word rendered in three.js and redrawn as live ASCII characters that ripple and follow the pointer, set in a locally bundled IBM Plex Mono, with a choice of words and a waves toggle.
React Bitsanimationinteractivereact-bitsMIT + Commons Clause License Condition v1.0 - A thinking indicator whose letters ripple in a shimmering wave. Motion Primitives, Text-effects, 0 votes, MIT licencetext-effects0
Motion Primitives Text Shimmer Wave
A thinking indicator whose letters ripple in a shimmering wave.
Motion Primitivescompiled-cssinteractivemotion-primitivesMIT - A loading message with a shimmering highlight sweeping across it at a local speed. Motion Primitives, Text-effects, 0 votes, MIT licencetext-effects0
Motion Primitives Text Shimmer
A loading message with a shimmering highlight sweeping across it at a local speed.
Motion Primitivescompiled-cssinteractivemotion-primitivesMIT - An attributed Text Scramble example with message switching, replay, screen-reader text and reduced-motion support. Motion Primitives, Text-effects, 0 votes, MIT licencetext-effects0
Motion Primitives Text Scramble
An attributed Text Scramble example with message switching, replay, screen-reader text and reduced-motion support.
Motion Primitivesanimationinteractivemotion-primitivesMIT - A headline whose letters roll into place, replayable with a new word. Motion Primitives, Text-effects, 0 votes, MIT licencetext-effects0
Motion Primitives Text Roll
A headline whose letters roll into place, replayable with a new word.
Motion Primitivescompiled-cssinteractivemotion-primitivesMIT - A follow button whose label morphs letter by letter between states. Motion Primitives, Text-effects, 0 votes, MIT licencetext-effects0
Motion Primitives Text Morph
A follow button whose label morphs letter by letter between states.
Motion Primitivescompiled-cssinteractivemotion-primitivesMIT - An attributed Text Loop example with local compiled CSS, accessible controls and reduced-motion support. Motion Primitives, Text-effects, 0 votes, MIT licencetext-effects0
Motion Primitives Text Loop
An attributed Text Loop example with local compiled CSS, accessible controls and reduced-motion support.
Motion Primitivescompiled-cssinteractivemotion-primitivesMIT - An attributed Text Effect example with local compiled CSS, accessible controls and reduced-motion support. Motion Primitives, Text-effects, 0 votes, MIT licencetext-effects0
Motion Primitives Text Effect
An attributed Text Effect example with local compiled CSS, accessible controls and reduced-motion support.
Motion Primitivescompiled-cssinteractivemotion-primitivesMIT - A rotating circular label around an open-for-hire badge, with a local speed. Motion Primitives, Text-effects, 0 votes, MIT licencetext-effects0
Motion Primitives Spinning Text
A rotating circular label around an open-for-hire badge, with a local speed.
Motion Primitivescompiled-cssinteractivemotion-primitivesMIT - A countdown timer whose digits slide vertically as each second ticks. Motion Primitives, Text-effects, 0 votes, MIT licencetext-effects0
Motion Primitives Sliding Number
A countdown timer whose digits slide vertically as each second ticks.
Motion Primitivescompiled-cssinteractiveitives-sliding-numberMIT - An attributed Motion Primitives Animated Number example with local CSS, accessible controls and announced state. Motion Primitives, Text-effects, 0 votes, MIT licencetext-effects0
Motion Primitives Animated Number
An attributed Motion Primitives Animated Number example with local CSS, accessible controls and announced state.
Motion Primitivescompiled-cssinteractivemotion-primitivesMIT - Story sections that animate in as they scroll into view inside a reading panel. Motion Primitives, Text-effects, 0 votes, MIT licencetext-effects0
Motion Primitives In View
Story sections that animate in as they scroll into view inside a reading panel.
Motion Primitivescompiled-cssin-viewinteractiveMIT - An attributed Word Rotate headline with local compiled CSS, speed, stop and reduced-motion controls. Magic UI, Text-effects, 0 votes, MIT licencetext-effects0
Magic UI Word Rotate
An attributed Word Rotate headline with local compiled CSS, speed, stop and reduced-motion controls.
Magic UIcompiled-cssinteractivemagic-uiMIT - A headline whose letters act as a window onto a looping video; the preview plays a short local gradient clip instead of a hosted video, with a choice of words and weights. Magic UI, Text-effects, 0 votes, MIT licencetext-effects0
Magic UI Video Text
A headline whose letters act as a window onto a looping video; the preview plays a short local gradient clip instead of a hosted video, with a choice of words and weights.
Magic UIcompiled-cssdeo-textinteractiveMIT - A search hint that types and deletes example queries in a loop with a blinking cursor. Magic UI, Text-effects, 0 votes, MIT licencetext-effects0
Magic UI Typing Animation
A search hint that types and deletes example queries in a loop with a blinking cursor.
Magic UIcompiled-cssinteractivemagic-uiMIT - A product statement whose words light up one by one as the preview scrolls. Magic UI, Text-effects, 0 votes, MIT licencetext-effects0
Magic UI Text Reveal
A product statement whose words light up one by one as the preview scrolls.
Magic UIcompiled-cssinteractivemagic-uiMIT - A headline animated word by word or character by character with a chosen entrance preset. Magic UI, Text-effects, 0 votes, MIT licencetext-effects0
Magic UI Text Animate
A headline animated word by word or character by character with a chosen entrance preset.
Magic UIcompiled-cssinteractivemagic-uiMIT
