Chánh Đại

Apple Hello Effect

Text 615

About

Create a "Hello" writing effect inspired by Apple using Motion for React.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Apple Hello Effect to your project and fits it to your theme.

Code

How Apple Hello Effect is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { AppleHelloEnglishEffect } from "@/components/ui/apple-hello-effect";

const AppleHelloEffectDemo = () => {
  return (
    <div className="flex w-full h-screen flex-col justify-center items-center gap-16">
      <AppleHelloEnglishEffect speed={1.1} />
    </div>
  );
};

export { AppleHelloEffectDemo };

Dependencies

More by Chánh Đại

View all
  • Theme Switcher

    Theme Switcher

    243
  • Hero Golden Spiral

    Hero Golden Spiral

    101
  • Mobius Loop Icon

    Mobius Loop Icon

    71
  • Wheel Picker

    Wheel Picker

    69
  • Testimonial 2

    Testimonial 2

    33
  • Glow Card Grid

    Glow Card Grid

    28
  • Spinning Circular Text

    Spinning Circular Text

    23
  • Team Section with Glow Cards

    Team Section with Glow Cards

    12

More in Text

View all
  • Vertical Cut Reveal Characters

    Vertical Cut Reveal Characters

    110
  • Motion Blur Text

    Motion Blur Text

    38
  • Text Reveal

    Text Reveal

    28
  • Toolbar

    Toolbar

    46
  • Typography

    Typography

    5
  • NeonRGBTextEffect

    NeonRGBTextEffect

    144
  • Vapour Text Effect

    Vapour Text Effect

    2K
  • Blur Reveal

    Blur Reveal

    311