Lumeo

ShimmerButton

Button with animated shimmer border beam.

When to Use

  • Draw attention to a primary call-to-action in hero sections or landing pages.
  • Differentiate a key action from surrounding buttons without heavy color changes.
  • Supports all the same variants and sizes as the regular Button component.

API Reference

ShimmerButton

Property Type Default Description
Shimmer bool true Enables the shimmer sweep animation.
ShimmerColor string? null CSS color value for the shimmer sweep. Defaults to a translucent foreground.
Variant Button.ButtonVariant Default Visual style: Default, Destructive, Outline, Secondary, Ghost, Link.
Size Button.ButtonSize Default Size: Default, Sm, Lg, Icon.
PressEffect Button.ButtonPressEffect None Visual feedback on press: None, Scale, Brightness, Ripple.
Disabled bool false Disables the button.
OnClick EventCallback<MouseEventArgs> Click event callback.
Class string? null Additional CSS classes merged onto the button.
  • Button — The base button component without the shimmer animation.
  • BorderBeam — Animated gradient border beam for non-button elements.
  • Sparkles — Decorative sparkle particle animation for text or elements.