> ## Documentation Index
> Fetch the complete documentation index at: https://api.fanvue.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# OnlineBlinkingIcon

> A small pulsing green dot indicator used to show online status.

```tsx theme={null}
import { OnlineBlinkingIcon } from "@fanvue/ui";
import type { OnlineBlinkingIconProps, OnlineBlinkingIconSize } from "@fanvue/ui";
```

## Examples

## Default

<Frame>
  <iframe src={"https://main--697a1b6dd4dad73ee9c0e5f5.chromatic.com/iframe.html?id=components-onlineblinkingicon--default&viewMode=story&shortcuts=false&singleStory=true&globals=theme:light"} width="100%" height="380" style={{border: "none", borderRadius: "8px"}} loading="lazy" title="OnlineBlinkingIcon — Default" />
</Frame>

```tsx theme={null}
import { OnlineBlinkingIcon } from "@fanvue/ui";

<OnlineBlinkingIcon />
```

## All Sizes

<Frame>
  <iframe src={"https://main--697a1b6dd4dad73ee9c0e5f5.chromatic.com/iframe.html?id=components-onlineblinkingicon--all-sizes&viewMode=story&shortcuts=false&singleStory=true&globals=theme:light"} width="100%" height="380" style={{border: "none", borderRadius: "8px"}} loading="lazy" title="OnlineBlinkingIcon — All Sizes" />
</Frame>

```tsx theme={null}
import { OnlineBlinkingIcon } from "@fanvue/ui";

<div className="flex items-center gap-4">
  <OnlineBlinkingIcon size="sm" />
  <OnlineBlinkingIcon size="md" />
</div>
```

## Props

## OnlineBlinkingIcon

A small pulsing green dot indicator used to show online status. Decorative only — pair with a visually-hidden label at the usage site to convey status to screen readers.

<ParamField path="size" type="&#x22;md&#x22; | &#x22;sm&#x22;" default="sm" />

## Exported types

Also exported from `@fanvue/ui`: `OnlineBlinkingIconProps`, `OnlineBlinkingIconSize`.

***

**Setup:** [Installation](/docs/ui/installation) · [Theming](/docs/ui/theming)
