Glow cloud preview

Glow cloud

A glowing cloud with eyes in blue or red-orange – it floats, turns to look around, blinks, follows the pointer and bounces with a wink when clicked

  • Group
    Card illustrations
  • Origin
    Copied · affectUI · source
  • License
    MIT
  • Added
    Oct 18
npx shadcn@latest add @deank/glow-cloud

The registry stays private. Install from the repo with a GitHub token — see the README.

Usage

import { GlowCloud } from "@/registry/blocks/glow-cloud/glow-cloud";

<GlowCloud />

Props

NameTypeDefaultDescription
color"blue" | "orange""blue"Blue-to-cyan or red-to-orange sky; the cloud's colors follow
backgroundbooleantrueFill the whole box with the sky gradient; false leaves the cloud on a transparent background with a soft colored edge
followPointerbooleantrueThe eyes follow the pointer while it's over the illustration
labelstringAccessible description of the illustration
classNamestringExtra class on the root

When to use

- A friendly face for an assistant, an AI feature or a cloud product – as an app icon, an empty state or a feature card - Landing pages that want a calm, living mascot instead of a static logo

When not to use

Interactive app UI; these are illustrations, so keep them out of task flows.

Related

Frost cloud