Components

Component Library

Explore our collection of modern and futuristic React components. Built with Tailwind CSS for ultimate customization without hidden magic.

Accent Frame

A dynamic frame with animated corner accents.

Arrow Loader

Full-width indeterminate loader with flowing SVG chevron arrows. Fully customizable arrow size, gap, thickness, speed, and color.

Ascii Rain

A futuristic falling ASCII matrix effect.

Badge

Futuristic label badge with pill, rectangle, and corner-cut shapes, dot indicators, and glow.

Border Beam Corner Cut

A corner cut card with a spinning border beam.

Card Slider

A generic card / image / video slider with touch swipe, arrow navigation, progress indicator (bar, dots, or counter), responsive visible count, auto-play, and full color customization.

Circular Progress

SVG arc-based radial progress ring with neon glow filter, animated fill transition, tick mark at origin, center value display, and sub-label. Zero dependencies beyond React.

Corner Cut Button

A button with a diagonal corner cut, multiple variants, colors, sizes and hover effects.

Crosshair

Animated crosshair cursor with two counter-rotating partial rings and a center crosshair. Fully customizable colors, sizes, ring thickness, arc gap, speed, and glow.

Cyber Circuit

Static SVG circuit traces entering from the corners with glowing terminal nodes. Configurable colors, line weight, dot style, and glow intensity.

Datalines With Grid

A grid with random data line tracers.

Footer

Fully customizable footer: minimal, columns, centered, and mega variants with link groups, social links, newsletter, and accent color system.

Glitch Text

Animated RGB split, CSS-only glitch effect.

Glyph City

Animated glyph cityscape with neon buildings, antennas, blinking peak lights, and flying vehicles.

Hexagons

Flat-top hexagon grid with customizable fill, border colors, hover highlight, ambient glow, and animated beam lines flowing along hex edges.

Holographic Terrain

Three.js wireframe terrain animated with layered sine waves and a cursor-reactive Gaussian bump. Mouse hover deforms the mesh in real time.

NavBar

All-in-one navbar: standard or dock variant, submenus, profile menu, transparent/glass/solid, fixed/floating/sticky positioning.

Neon Bar Chart

Recharts-powered bar chart with top-rounded neon bars, custom glow drop-shadow, multi-color mode, multi-series support, and horizontal layout.

Neon Checkbox

Corner-cut cyberpunk checkbox with neon glow on check, animated SVG checkmark, indeterminate state (dash), size presets, and accessible aria-checked semantics.

Neon Donut Chart

Recharts-powered donut/ring chart with per-segment neon glow, interactive center label, hover dimming, auto color palette, and a custom legend.

Neon Glow

Highly customizable neon glow text with single color, multi-color gradients (linear, radial, conic), and animated effects.

Neon Glow Corner Cut Card

A corner cut card with a neon gradient glow backdrop, icon box, and fully customizable colors, sizes and hover effects.

Neon Input

A fully-featured text input with the iconic NeonBlade corner-cut shape, neon focus glow, full color customization, label, hint, error state, prefix/suffix slots, border styles, background opacity, and all standard HTML input types.

Neon Line Chart

Recharts-powered line/area chart with neon glow strokes, gradient area fills, multi-series support, and a corner-cut tooltip.

Neon Modal

Cyberpunk-styled modal dialog with corner cuts, neon glow, comet border beam, animated entry/exit, scrollable body, header/footer slots, and full color customization.

Neon Select

Fully accessible custom dropdown with keyboard navigation (arrows/enter/esc), controlled and uncontrolled modes, neon glow trigger, animated clip-path listbox panel, and disabled option support.

Neon Sparkline

Inline mini sparkline for embedding in KPI cards and stat widgets. Neon glow stroke, gradient fill, and a minimal tooltip.

Neon Table

Sortable, paginated data table with neon scan-line row hover, corner accent marks, animated sort indicators, custom cell renderers, striped rows, and cyberpunk pagination controls.

Neon Toggle

An accessible switch/toggle with a neon-glowing track, animated thumb slide, spark particle burst on activation, size presets, and full color control. Supports controlled and uncontrolled modes.

Notch Card

Futuristic card with rectangular notch indentations on any sides, beam border, gradient border, and hover effects.

Outline Text

Outline-only text with customizable stroke color, fill, stroke width, per-letter proximity hover effect, color transitions, and neon glow.

Pluviophile

Natural rain background with canvas-rendered falling streaks. Configurable angle, speed, color, density, and drop size.

Progress Bar

Horizontal neon progress bar with solid, segmented, striped, and pulse variants. Supports size presets, glow, percentage label, and smooth fill transition.

Stat Card

Dashboard KPI metric card with neon corner accents, scan-line hover, large value display, trend arrow with color coding, and an embedded NeonSparkline.

Timeline

Futuristic neon timeline with multiple variants, dot shapes, line styles, alignment modes, and staggered animate-in.