NexoreUI
2.0
InstallationComponentsIconsTemplatesNewNexore MakePricing
Create Project
GitHub
NexoreUI
2.0
Navigation
InstallationComponentsIconsTemplatesNexore MakeCreate Project
InstallationComponents OverviewIcons
Categories (65)
ButtonInputCheckboxSelectSwitchSliderRatingFile Upload
CardAccordionTabsTableStepperScroll AreaNavigationDockData DisplayChartsCommerce
Modal (Dialog)AlertBadgeAvatarTooltipProgressSkeletonLoadersToasterSocial
Aurora Border CardAurora Search PillAI Prompt InputCommandInteractive Code BlockPro AI
Media ShowcaseOverlays & DrawersPro ButtonsPro DashboardsPro E-CommercePro FeedbackPro FormsPro InputsPro LayoutsPro ListsPro MarketingPro NavigationPro TablesSpecial FormsUltra Components
OverviewPro CardsPro ObjectsSoundPulseSilkUnveilNode Flow Graph
NexoreUI v2.0Studio
DocsMorphing Geometry

Morphing Geometry

Interactive geometric entity with fluid corner transitions, continuous rotation, and specular surface styling.

PreviousAurora Border FX
NextInteractive Code Block
On This Page
Quick ActionsProject StudioNewNexore Make (AI)Source on GitHub
New Component

Morphing Geometry

An interactive geometric entity with fluid corner transitions, continuous ambient rotation, specular surface glare, and customizable color gradient palettes.

npx nexoreui add morphing-geometry

Interactive Playground

Configure Props

Usage Examples

1. Interactive Click-to-Morph

component.tsx
1

2. Continuous Ambient Spin

component.tsx
1
Page 1 of 3

API Reference

PropTypeDefaultDescription
shape"squircle" | "circle" | "pill" | "square" | "custom""squircle"Corner curvature profile for geometry morphing.
radiusnumber | string-Explicit border radius override (e.g. 24 or '1.5rem').
color"violet" | "cyan" | "emerald" | "rose" | "amber" | "rainbow" | "mono""violet"Color theme with matching gradients and specular borders.
variant"gradient" | "aurora" | "neon" | "glass" | "outline" | "subtle""gradient"Surface material treatment.
spinbooleanfalseEnables continuous 360-degree rotational animation.
interactivebooleanfalseWhether clicking smoothly morphs the shape to the next preset.
glowbooleantrueRenders matching ambient box-shadow glow.