Cool Button

A dual-layer orbit glow that soft-spins around the edge of any button or link you wrap it around, at zero layout cost.

elite micro interactionscoolbutton

Installation

Run the following command

~/your-project

pnpm dlx wensity@latest add cool-button

Usage

Import CoolButton from @/components/wensity/cool-button and render it anywhere in your React or Next.js app. The source lands in your own repo, so every prop, class and animation below is yours to edit.

app/example.tsx

 1"use client";
 2import { CoolButton } from "@/components/wensity/cool-button";
 3
 4export default function Example() {
 5  return (
 6    <CoolButton as="button">
 7      Welcome to wensity ui
 8    </CoolButton>
 9  );
10}

Props

Prop	Type	Default	Description
`as`	"a" \| "button"	"a"	Render as an anchor or button.