Getting started
Texts
Arc TitleBlade RevealBlended HoverBlur ReadingBlur RevealCountdownCounterCounter v2Decode HoverDecode RevealExchange TitleFluid Gradient TitleHighlight HoverInline ImagesLetter LauncherMask HoverMousefill TitleRandom LettersScribble RevealScroll CascadingScroll GradientScroll ReadingSVG RevealSwap Hover3D Swap HoverText ShimmerTwist RevealTypedUnderline HoverUnfold HoverUnfold Reveal
Buttons
Menus
Backgrounds
Cores
Back to TopClick & CopyCodepenCookiesDark ModeExpandersFlipboxGlitchyGlowing CardHorizontal MarqueeHorizontal ScrollInteractive DividerInverted CornerLampLottieMotion DividerNext TabsObserverParallax HoverPixels Shimmer CardProgress BarScrollbarSharerSmooth ScrollSpinnerStacking CardsTable of ContentsTimelineTippyVertical MarqueeQR Code
Features
Jose Tamu
July 16, 2024 / Beginner
Microbox Button
How it works
Microbox Button can’t work with paddings, so in order to modify it’s dimensions they have to be set using scale control available at Style controls.
Animation controls
In duration: determines the entrance duration of the squares. The demo uses 500.
Out duration: determines the exit duration of the squares. The demo uses 1200.
Stagger: determines the delay before the next square starts animating. The demo uses 200.
Autoplay: if enabled, the animation will play only once automatically.
Loop: if enabled, the animation will play in an infinite loop. Requires Autoplay to be enabled.
– Tamu
On this page