React Border Effect Components

Dev Design Library indexes 29 React border effect components from 15 open-source UI libraries, with the most coming from Aceternity UI, Velora UI, React Bits, Shadcn Space and Spectrum UI. Each one links to its page with the source code, a live preview where available, the library license and the install command. Every library in this list targets React. Border effect components belong to the Effects group.

• Border GlowReact Bits · ReactGlowing mesh-gradient border that follows cursor direction and intensifies near edges.
• Border BeamMagic UI · ReactAn animated beam of light which travels along the border of its container.
• B
  Border BeamLibraries.dev · ReactAnimated border beam effect for React
• Beam CardSpectrum UI · ReactA card wrapped in an animated border beam, traveling or breathing, in four color palettes.
• Flow ButtonSpell UI · ReactA button with animated flowing dashed border on hover.
• Glow Border CardVengeance UI · ReactCard with animated glow border
• Shine Border-01 - BasicShadcn Space · ReactShine Border component
• Border BeamBadtz UI · ReactDisplays an animated border effect with a glowing beam around the content that adapts to the size of the container.
• Chrome Border ButtonRewamp UI · React
• Liquid Badgeglasscn · ReactA liquid-glass badge wrapper that keeps the base badge fill and applies the effect to the border.
• Subscribe Shine ButtonMicroKit · ReactA dark subscribe pill with a rotating highlight that traces its edge on hover.
• Border BeamVelora UI · ReactA beam of light traveling around any border.
• Liquid Metal BorderSpaceUI · ReactLiquid metal shader as a border wrap. Put any registry component inside.
• Glow CardReactFrame · ReactA card with an animated rotating conic-gradient glow border, customizable colors, text position, and an optional…
• Background GradientAceternity UI · React
• Electric BorderReact Bits · ReactJittery electric energy border with animated arcs, glow and adjustable intensity.
• Shine BorderMagic UI · ReactShine border is an animated background border effect.
• M
  Metal FxLibraries.dev · ReactLiquid metal shader effects for React: rings, buttons, metal text and badges, with glow, proximity reflections and…
• Beam Search BarSpectrum UI · ReactA search bar whose bottom edge lights up with a traveling beam while it has focus.
• Border BeamVengeance UI · React
• Shine Border 06 - Focus FrameShadcn Space · ReactA camera focus-lock shine border with pulsing corner brackets instead of a continuous glowing ring, wrapping a simple…
• Split CTA with product visualVelora UI · ReactTwo-column CTA card with a benefit list and a dashboard mock-up, traced by an animated border beam.
• Glowing EffectAceternity UI · React
• Star BorderReact Bits · ReactAnimated star / sparkle border orbiting content with twinkle pulses.
• Shine Border 07 - Marching DashesShadcn Space · ReactA marching dashes shine border with a crisp animated dashed outline continuously travelling around the edge, wrapping…
• Glowing EffectVelora UI · ReactBorder glow that follows the pointer around a card's edge as it comes near.
• Hover Border GradientAceternity UI · React
• Moving BorderVelora UI · ReactA light laps the button's border via offset-path.
• Moving BorderAceternity UI · React

Libraries with React border effect components

• Aceternity UI
• Velora UI
• React Bits
• Shadcn Space
• Spectrum UI

Related categories

• Border Effect Components
• Tailwind CSS Border Effect Components
• Animated Border Effect Components
• React Effect Components
• React Image Effect Components
• React Transition Components
• React Cursor Effect Components
• React Marquee Components
• React Mask Effect Components
• React Reveal Wrapper Components
• React Glow Effect Components
• React Spotlight Effect Components
• React Tilt Effect Components
• React Blur Overlay Components
• React Confetti Components