Ascii Jellyfish

Translucent jellyfish drawn as ASCII glyphs, pulsing through the water with trailing tentacles.

Interaction Type

Jellyfish squeeze their glowing bells, glide, and drift while their tentacles sway behind. Light shimmers across each bell and every pulse pushes the plankton aside. They wander anywhere inside their container but never leave it. Move the pointer near one and it swims away. Click to send a ripple and startle the ones close by. Honors prefers-reduced-motion.

Installation

How to use

import { AsciiJellyfish } from "@/components/ui/ascii-jellyfish"

export function Demo() {
  return <AsciiJellyfish variant="color" className="h-96 w-full rounded-2xl" />
}

Source Code

1// Loading…

Props

Options you can pass to customize this component.

Keep in mind

Most components here are recreations of great work from around the web. I don't claim to be the original creator - this is my attempt to reverse-engineer, replicate, and often add a few extra features. I've tried to credit everyone; if I missed someone, let me know.

Credits

• •Inspired by stackedlol/ascii-sharks

Contact

Found a bug or issue? Feel free to drop a DM.

License & Usage

• •MIT with the Commons Clause and an attribution requirement. Free to use, modify and ship in personal and commercial projects, closed source included. You own the code once it is in your project.
• •Credit is required. Any project shipping a Pixel UI component must credit Pixel UI with a visible link back to pixelui.dev, in a footer, an about page, a credits screen or a README.
• •Don't strip the credit or the copyright notice from the source you copied.
• •Don't sell, sublicense or redistribute the components themselves, on their own, bundled into a template, kit, theme or paid course, or ported to another framework.
• •Don't republish them. No mirrors, no re-uploads, no listing them as your own work.
• •Don't repackage the registry as a competing component library.
• •Don't claim authorship of a component or of Pixel UI itself.
• •The LICENSE file in the repository is the full text and governs. Ask first if your use doesn't fit these rules.