Oihana Next UI - 0.1.47

Application logo

Status Components

Status is a really small icon (with an optional label) to visually show the current status of an element, like online, offline, error, etc.

Status Examples

All Colors

Primary
Secondary
Accent
Neutral
Info
Success
Warning
Error

All Sizes

XS
SM
MD (default)
LG
XL

Without Label

Label Position

Label right (default)
Label left

Animations

Ping
Bounce
Pulse
Spin

Practical Use Cases

Server Status

API Server — Online
Database — Degraded
Cache — Offline
Backup — Maintenance

User Presence

Online
Away
Busy
Offline

In a List

Build
Passed
Tests
Passed
Lint
Warnings
Deploy
Failed
Release
Pending

Custom Element

As span
  • As li