Text Scramble

pnpm dlx shadcn@latest add https://motion-kit-astro.vercel.app/r/text-scramble.json

npx shadcn@latest add https://motion-kit-astro.vercel.app/r/text-scramble.json

bunx --bun shadcn@latest add https://motion-kit-astro.vercel.app/r/text-scramble.json

yarn dlx shadcn@latest add https://motion-kit-astro.vercel.app/r/text-scramble.json

---
import "@/components/motion-kit/text-scramble-element.ts";
---

<motion-text-scramble text="Hello World"></motion-text-scramble>

import "@/components/motion-kit/text-scramble-element.ts";

export default function Page() {
  return (
    <motion-text-scramble text="Hello World" />
  );
}

<script setup>
import "@/components/motion-kit/text-scramble-element.ts";
</script>

<template>
  <motion-text-scramble text="Hello World" />
</template>

<script>
  import "@/components/motion-kit/text-scramble-element.ts";
</script>

<motion-text-scramble text="Hello World" />

<script type="module" src="/components/motion-kit/text-scramble-element.js"></script>

<motion-text-scramble text="Hello World"></motion-text-scramble>