HomeBookmarks
SpellSpell
Spell

Spell

Refined, animated React UI components for design engineers to copy and paste into any project.

TOby tom
34components2.3Mviews8.5Kbookmarks

Installs all 31 components. Without our CLI, run instead.

Auto-indexed

Spell contents

  • Words Stagger

    Words Stagger

  • Randomized Text

    Randomized Text

  • Slide Up Text

    Slide Up Text

  • Blur Reveal

    Blur Reveal

  • QR Code

    QR Code

  • QR Code

    QR Code

  • QR Code

    QR Code

  • Tilt Card

    Tilt Card

  • Tilt Card

    Tilt Card

  • Tilt Card

    Tilt Card

  • Fallback Avatar

    Fallback Avatar

  • Fallback Avatar

    Fallback Avatar

  • Fallback Avatar

    Fallback Avatar

  • Keyboard Shortcuts

    Keyboard Shortcuts

  • Keyboard Shortcuts

    Keyboard Shortcuts

  • Keyboard Shortcuts

    Keyboard Shortcuts

  • Tweet

    Tweet

  • Text Marquee

    Text Marquee

  • Marquee

    Marquee

  • Spinner

    Spinner

  • Special Text

    Special Text

  • Shimmer Text

    Shimmer Text

  • Rich Button

    Rich Button

  • Pop Button

    Pop Button

  • About Spell

    Spell publishes a shadcn registry at spell.sh, with 31 components installable through the shadcn CLI.

    Components
    31
    GitHub stars
    1,360
    Last commit
    Oct 10, 2026
    Repository
    xxtomm/spell-ui

    Also in the Spell registry

    Copy a prompt for your agent, copy the install command, or open the docs that ship it.

    • Color Selector

      color-selector

      Interactive color picker component.

      1 file
      Docs ↗
    • Light Rays

      light-rays

      Animated light rays effect using WebGL shaders.

      three1 file
      Docs ↗
    • Logos Carousel

      logos-carousel

      Animated carousel component that cycles through sets of logos with staggered animations.

      1 file
      Docs ↗
    • Signature

      Animated signature component with handwriting effect using custom fonts.

      motion, opentype.js, @types/opentype.js1 file
      Docs ↗
    • Spotify Card

      spotify-card

      Display Spotify tracks with album art and blurred background.

      @icons-pack/react-simple-icons, spotify-url-info1 file
      Docs ↗

    From the Spell readme

    Spell UI

    Beautiful, sophisticated UI components designed for modern React and Tailwind CSS applications.

    Documentation

    Visit https://spell.sh/docs to view the documentation.

    Contributing

    Visit our contributing guide to learn how to contribute.

    Community

    Have questions, comments or feedback? Join our Discord.

    Star History

    License

    Licensed under the MIT license.

    Read the rest on GitHub →

    Hooks and utilities

    • badge
    • chart

    Registries like Spell

    Magic UI

    Magic UI

    by Dillion Verma

    64

    components

    coss

    coss

    by coss

    74

    components

    Motion Primitives

    Motion Primitives

    by Julien Thibeaut

    39

    components

    cult ui

    cult ui

    by cult/ui

    50

    components

    Animate UI

    Animate UI

    by Elliot Sutton

    33

    components

    UI Layouts

    UI Layouts

    by UI Layouts

    127

    components

    Browse every shadcn registry we track →

    1. Components
    2. /
    3. tom
    4. /
    5. Spell

    Related libraries

    Ruixen UI

    Ruixen UI

    by Ruixen UI

    347

    components

    Efferd

    Efferd

    by Efferd

    114

    components

    HextaUI

    HextaUI

    by Preet Suthar

    119

    components

    Cnippet

    Cnippet

    by Cnippet

    347

    components

    shadcn/ui

    shadcn/ui

    by shadcn

    87

    components

    Geist

    Geist

    by tigran tumasov

    72

    components

    About Spell

    Spell is a component library on 21st.dev by tom with 26 public React components. Every component ships with a live interactive preview and full TSX source — copy the code, install it through the shadcn CLI, or pull it into Cursor or Claude Code over MCP.

    All 26 Spell components

    • Animated Checkbox
    • Animated Gradient
    • Bars Spinner
    • Blur Reveal
    • Copy Button
    • Exploding Input
    • Fallback Avatar
    • Flow Button
    • Gradient Wave Text
    • Highlighted Text
    • Keyboard Shortcuts
    • Label Input
    • Marquee

    Browse all component libraries →

  • Perspective Book
  • Pop Button
  • QR Code
  • Randomized Text
  • Rich Button
  • Shimmer Text
  • Slide Up Text
  • Special Text
  • Spinner
  • Text Marquee
  • Tilt Card
  • Tweet
  • Words Stagger