# Morphing Text — Skecher UI

A text morphing effect for hero copy, onboarding moments, empty states, and editorial interfaces that need a polished animated entrance.

## Install

```bash
bunx --bun shadcn@latest add CoDesign-Spa27/skecher-ui/text-morphing
```

## Dependencies

- motion

## Implementation guidance

- No additional implementation constraints are documented.

## Usage

```tsx
import { MorphingText } from "@/components/ui/text-morphing";

const statusMessages = [
  "Analyzing your workspace...",
  "Finding useful patterns...",
  "Preparing your answer...",
];

export default function MorphingTextExample() {
  return (
    <MorphingText
      texts={statusMessages}
      interval={2400}
      className="text-3xl font-semibold tracking-tight"
    />
  );
}
```

## Source files

- components/ui-components/text-morphing.tsx — Morphing text component

## Canonical resources

- Documentation: https://skecher-ui.com/docs/text-morphing
- Registry item with complete source: https://skecher-ui.com/r/text-morphing.json
- Component AI context: https://skecher-ui.com/llms/text-morphing