Widgets
Professional dashboard widgets and data visualization components. Includes KPI, charts, gauges, revenue analytics, and server monitoring widgets.
Pro Features
Unlock advanced capabilities with the Pro version
6 Different Widget Types
Comprehensive dashboard support with KPI, Chart, Gauge, Funnel, Revenue, and ServerMonitor widgets
8+ Background Variants
Multiple style options including default, glass, gradient, overlay, floating, colored, bordered and minimal
8-Direction Gradients
Full compass gradient directions (to-t, to-tr, to-r, to-br, to-b, to-bl, to-l, to-tl) with smooth transitions
Overlay Patterns
4 different overlay patterns (dots, grid, diagonal, waves) with customizable opacity and colors
Floating Effects
Advanced hover animations with dynamic shadow effects and smooth transitions
Flexible Layout System
Responsive dashboard layouts with grid system and adaptive sizing
Advanced Filtering
Multi-level filtering and data manipulation tools
Smart Alerts
Threshold-based automatic notifications and alerts with visual indicators
Installation
Install via CLI
npx moonui-cli@latest add widgets --pro
Usage
Key Performance Indicators
Total Revenue
45231.57$
Active Users
1284.89
Conversion Rate
89.38%
Compact KPIs
Total Revenue
Total Revenue
45231.57$
Active Users
Active Users
1284.89
Conversion Rate
Conversion Rate
89.38%
Examples
KPI Widget Examples
Display key performance indicators with trends, targets and status indicators.
Key Performance Indicators
Total Revenue
45231.57$
Active Users
1284.89
Conversion Rate
89.38%
Compact KPIs
Total Revenue
Total Revenue
45231.57$
Active Users
Active Users
1284.89
Conversion Rate
Conversion Rate
89.38%
Chart Widget Examples
Interactive charts with multiple visualization types including bar, line, area and donut charts.
Monthly Sales
Total
331000
Traffic Trend
Budget Distribution
Gauge Widget Examples
System performance and resource usage gauges with customizable thresholds and indicators.
System Performance
Resource Usage
Funnel Widget Examples
Conversion funnel visualization with multiple display formats and real-time analytics.
Sales Funnel
Overall Conversion Rate
8.5%
Conversion Process
Overall Conversion Rate
8.5%
Customer Journey
Overall Conversion Rate
8.5%
Visitors
Sign-ups
Trial Users
Paid Customers
Revenue Widget Examples
Comprehensive revenue tracking with breakdown analysis, forecasting and customer metrics.
Revenue Overview
Total Revenue (This Month)
$285,420
+15.3%
vs last month
$312,000
85% confidence
Revenue Streams
Revenue Breakdown
Revenue Details
Total Revenue (This Month)
$285,420
+15.3%
vs last month
$312,000
85% confidence
Revenue Breakdown
Revenue Dashboard
Total Revenue (This Month)
$285,420
+15.3%
vs last month
$312,000
85% confidence
Revenue Breakdown
Revenue Streams
Server Monitor Widget Examples
Real-time server monitoring with status indicators, alerts and performance metrics.
Server Status
Production Server 1
US-East
Requests
1250/s
Response
45ms
Database Server
US-West
Server Grid
Production Server 1
US-East
Requests
1250/s
Response
45ms
Database Server
US-West
Server List
US-East
CPU
64.71%
Memory
11.6GB
Uptime
99.95%
US-West
CPU
44.77%
Memory
26.21GB
Uptime
99.99%
Server Details
Production Server 1
US-East
Requests
1250/s
Response
45ms
Complete Dashboard Layout
Real-world dashboard composition using multiple widgets together in a responsive grid layout.
Revenue
Total Revenue
45231.57$
Users
Active Users
1284.89
Conversion
Conversion Rate
89.38%
Sales Performance
Total
331000
Performance Score
Widget Background Variants
Showcase all available background variants with different visual styles and effects.
All Background Variants
Default
Revenue (Default)
Total Revenue
45231.57$
Glass
Glass Background
Total
268000
Gradient
Gradient Background
Colored
Colored Background
Total Revenue
45231.57$
Floating
Floating Background
Overlay with Dots
Overlay Background
Overall Conversion Rate
8.5%
Bordered
Bordered Background
CPU
64.7%
Memory
11.6GB
Uptime
99.95%
Minimal
Minimal Background
CPU
64.7%
Memory
11.6GB
Uptime
99.95%
All Gradient Directions
To Top ↑
to-t
To Top-Right ↗
to-tr
To Right →
to-r
To Bottom-Right ↘
to-br
To Bottom ↓
to-b
To Bottom-Left ↙
to-bl
To Left ←
to-l
To Top-Left ↖
to-tl
Overlay Patterns
Dots Pattern
dots Pattern
Total
268000
Grid Pattern
grid Pattern
Total
268000
Diagonal Pattern
diagonal Pattern
Total
268000
Waves Pattern
waves Pattern
Total
268000
Floating Effect - Hover to See Shadow Change
Normal (shadow-lg)
Normal Shadow
Total Revenue
45231.57$
Floating (shadow-2xl → 3xl on hover)
Floating Effect
Total Revenue
45231.57$
Floating + Colored
Floating Colored
Total Revenue
45231.57$
Widgets with Overlay Effects
Showcase of widgets using overlay background variant for modern glass-morphism effects.
Performance Metrics with Glass Effect
Total Revenue
45231.57$
Active Users
1284.89
Conversion Rate
89.38%
Analytics with Overlay
Total
328000
System Performance Glass
Background Variants Showcase
Various background styles for widgets - gradient, colored, glass, bordered, and floating effects.
Gradient Variant
Total Revenue
45231.57$
Gradient Chart
Total
268000
Colored Variant
Total Revenue
45231.57$
Colored Monitor
US-East
CPU
64.71%
Memory
11.6GB
Uptime
99.95%
Glass Effect Variant
Total Revenue
45231.57$
Active Users
1284.89
Conversion Rate
89.38%
Floating Variant 1
Total Revenue
45231.57$
Floating Variant 2
Active Users
1284.89
Floating Variant 3
Conversion Rate
89.38%
Dots Pattern
Grid Pattern
Diagonal Pattern
Waves Pattern
Bordered Funnel
Overall Conversion Rate
8.5%
Bordered Chart
Total
219000