# Dynamic Status Button

> The DynamicStatusButton component is a sleek and professional UI element built entirely with shadcn UI. It displays an icon and label that dynamically change based on context, such as theme, weather, or system status, while using plain, neutral colors for a clean and modern appearance. Each status has its own background and text color, chosen for clarity and readability, ensuring seamless integration into dashboards, apps, or any interface. The component is fully configurable, supports smooth animated transitions between statuses, and adapts gracefully to different button sizes, making it a versatile and elegant solution for context-aware interactive buttons.

- Author: [Ruixen UI](https://21st.dev/@ruixen.ui)
- Library: [Ruixen UI](https://21st.dev/@ruixen.ui/library/ruixen-ui)
- License: unknown
- npm dependencies: framer-motion
- Live preview: https://21st.dev/@ruixen.ui/components/dynamic-status-button

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/ruixen.ui/dynamic-status-button?api_key=$API_KEY_21ST"
```

Requires a 21st API key (generate one at https://21st.dev/mcp) passed as `API_KEY_21ST`. Free accounts get a limited number of installs per day; unlimited on a paid plan — see https://21st.dev/pricing.

Full component directory: https://21st.dev/llms.txt