ComponentsBackgrounds & effects
Colour Pool
A pool of soft colour: blurred blobs drift on slow loops over a base colour, and one follows the pointer.
"use client";
import { ColourPool } from "@/components/miyuki-ui/colour-pool";
export default function ColourPoolDemo() {
return (
<ColourPool className="flex size-full items-center justify-center px-6 py-12 text-center">
<h2 className="max-w-3xl font-display text-5xl leading-[1.04] font-semibold tracking-[-0.02em] text-balance sm:text-6xl md:text-7xl">
The first warm day of March
</h2>
</ColourPool>
);
}Install
npx shadcn@latest add @miyuki-ui/colour-poolThis needs the @miyuki-ui registry in your components.json. See Using the shadcn CLI.
Props
ColourPool
Prop
Type