E
educlopez
/
thegridcn-ui
/
components
Files
Code
Info
Accordion
accordion
Agent Avatar
agent-avatar
Alert
alert
Alert
alert
Alert Dialog
alert-dialog
Announcement Bar
announcement-bar
Anomaly Banner
anomaly-banner
Arrival Panel
arrival-panel
Aspect Ratio
aspect-ratio
Avatar
avatar
Avatar Group
avatar-group
Badge
badge
Beam Marker
beam-marker
Bento Grid
bento-grid
Boot Sequence
boot-sequence
Breadcrumb
breadcrumb
Breadcrumb Nav
breadcrumb-nav
Button
button
Button Group
button-group
Calendar
calendar
Card
card
Carousel
carousel
Changelog
changelog
Chart
chart
Helper to extract item config from a payload.
Checkbox
checkbox
Chip
chip
Circuit Background
circuit-background
Collapsible
collapsible
Command
command
Command Menu
command-menu
Comparison Table
comparison-table
Context Menu
context-menu
Coordinate Display
coordinate-display
Countdown
countdown
Crt Effect
crt-effect
CRT monitor effect with scanlines, vignette, flicker, and scan sweep animation. * Wrap any content to give it a retro CRT monitor appearance.
CTA Banner
cta-banner
Data Card
data-card
Data Stream
data-stream
Data Table
data-table
Derez Timer
derez-timer
Diagnostics Panel
diagnostics-panel
Dialog
dialog
Divider
divider
Drawer
drawer
Dropdown
dropdown
Dropdown Menu
dropdown-menu
Empty
empty
Empty State
empty-state
Energy Meter
energy-meter
FAQ
faq
Feature Card
feature-card
Field
field
File Upload
file-upload
Floating Panel
floating-panel
Form
form
Gauge
gauge
Glow Container
glow-container
Grid
grid
Convert hex to THREE.Color
Grid Floor
grid-floor
Grid Scan Overlay
grid-scan-overlay
Heatmap
heatmap
Hover Card
hover-card
Hud
hud
Hud Corner Frame
hud-corner-frame
HUD Frame
hud-frame
Identity Disc
identity-disc
Input
input
Input Group
input-group
Input Otp
input-otp
Item
item
Kanban Board
kanban-board
Kbd
kbd
Label
label
Location Display
location-display
Logo Cloud
logo-cloud
Map
map
Map Marker
map-marker
Marquee
marquee
Menubar
menubar
Modal
modal
Navigation Menu
navigation-menu
Notification
notification
Number Input
number-input
Pagination
pagination
Popover
popover
Pricing Card
pricing-card
Progress
progress
Progress Bar
progress-bar
Progress Ring
progress-ring
Radar
radar
Radio Group
radio-group
Rating
rating
Regen Indicator
regen-indicator
Reticle
reticle
Scroll Area
scroll-area
Select
select
Separator
separator
Sheet
sheet
Sidebar
sidebar
Signal Indicator
signal-indicator
Skeleton
skeleton
Slider
slider
Sonner
sonner
Sparkline
sparkline
Speed Indicator
speed-indicator
Spinner
spinner
Stat
stat
Stat Card
stat-card
Stats Counter
stats-counter
Status Bar
status-bar
Stepper
stepper
Switch
switch
Table
table
Tabs
tabs
Tag
tag
Terminal
terminal
Testimonial Card
testimonial-card
Text Input
text-input
Textarea
textarea
Tron Alert
thegridcn-alert
Badge
thegridcn-badge
Pagination
thegridcn-pagination
Select
thegridcn-select
Skeleton
thegridcn-skeleton
Slider
thegridcn-slider
Tabs
thegridcn-tabs
Timeline
thegridcn-timeline
Toggle
thegridcn-toggle
Tooltip
thegridcn-tooltip
Timeline Bar
timeline-bar
Timer
timer
Toast
toast
Toggle
toggle
Toggle Group
toggle-group
Tooltip
tooltip
Tunnel
tunnel
Instanced tunnel rings for better performance
Uplink Header
uplink-header
Video Player
video-player
Video Progress
video-progress
Waveform
waveform
Select a component to view its code
Click on any item in the sidebar to get started
Select a component to view its information
Accordion
accordion
Agent Avatar
agent-avatar
Alert
alert
Alert
alert
Alert Dialog
alert-dialog
Announcement Bar
announcement-bar
Anomaly Banner
anomaly-banner
Arrival Panel
arrival-panel
Aspect Ratio
aspect-ratio
Avatar
avatar
Avatar Group
avatar-group
Badge
badge
Beam Marker
beam-marker
Bento Grid
bento-grid
Boot Sequence
boot-sequence
Breadcrumb
breadcrumb
Breadcrumb Nav
breadcrumb-nav
Button
button
Button Group
button-group
Calendar
calendar
Card
card
Carousel
carousel
Changelog
changelog
Chart
chart
Helper to extract item config from a payload.
Checkbox
checkbox
Chip
chip
Circuit Background
circuit-background
Collapsible
collapsible
Command
command
Command Menu
command-menu
Comparison Table
comparison-table
Context Menu
context-menu
Coordinate Display
coordinate-display
Countdown
countdown
Crt Effect
crt-effect
CRT monitor effect with scanlines, vignette, flicker, and scan sweep animation. * Wrap any content to give it a retro CRT monitor appearance.
CTA Banner
cta-banner
Data Card
data-card
Data Stream
data-stream
Data Table
data-table
Derez Timer
derez-timer
Diagnostics Panel
diagnostics-panel
Dialog
dialog
Divider
divider
Drawer
drawer
Dropdown
dropdown
Dropdown Menu
dropdown-menu
Empty
empty
Empty State
empty-state
Energy Meter
energy-meter
FAQ
faq
Feature Card
feature-card
Field
field
File Upload
file-upload
Floating Panel
floating-panel
Form
form
Gauge
gauge
Glow Container
glow-container
Grid
grid
Convert hex to THREE.Color
Grid Floor
grid-floor
Grid Scan Overlay
grid-scan-overlay
Heatmap
heatmap
Hover Card
hover-card
Hud
hud
Hud Corner Frame
hud-corner-frame
HUD Frame
hud-frame
Identity Disc
identity-disc
Input
input
Input Group
input-group
Input Otp
input-otp
Item
item
Kanban Board
kanban-board
Kbd
kbd
Label
label
Location Display
location-display
Logo Cloud
logo-cloud
Map
map
Map Marker
map-marker
Marquee
marquee
Menubar
menubar
Modal
modal
Navigation Menu
navigation-menu
Notification
notification
Number Input
number-input
Pagination
pagination
Popover
popover
Pricing Card
pricing-card
Progress
progress
Progress Bar
progress-bar
Progress Ring
progress-ring
Radar
radar
Radio Group
radio-group
Rating
rating
Regen Indicator
regen-indicator
Reticle
reticle
Scroll Area
scroll-area
Select
select
Separator
separator
Sheet
sheet
Sidebar
sidebar
Signal Indicator
signal-indicator
Skeleton
skeleton
Slider
slider
Sonner
sonner
Sparkline
sparkline
Speed Indicator
speed-indicator
Spinner
spinner
Stat
stat
Stat Card
stat-card
Stats Counter
stats-counter
Status Bar
status-bar
Stepper
stepper
Switch
switch
Table
table
Tabs
tabs
Tag
tag
Terminal
terminal
Testimonial Card
testimonial-card
Text Input
text-input
Textarea
textarea
Tron Alert
thegridcn-alert
Badge
thegridcn-badge
Pagination
thegridcn-pagination
Select
thegridcn-select
Skeleton
thegridcn-skeleton
Slider
thegridcn-slider
Tabs
thegridcn-tabs
Timeline
thegridcn-timeline
Toggle
thegridcn-toggle
Tooltip
thegridcn-tooltip
Timeline Bar
timeline-bar
Timer
timer
Toast
toast
Toggle
toggle
Toggle Group
toggle-group
Tooltip
tooltip
Tunnel
tunnel
Instanced tunnel rings for better performance
Uplink Header
uplink-header
Video Player
video-player
Video Progress
video-progress
Waveform
waveform
Select a component to view its code
Click on any item in the sidebar to get started
Select a component to view its information