# Dev Log Tail

Live log tail with level filter, search highlighting and pause resume.

- id: `dev-log-tail`
- Page: https://agentic-ui-kit.com/components/dev-log-tail
- Live preview: https://agentic-ui-kit.com/live/component/dev-log-tail?piece=dev-log-tail

## Install

```bash
agentic-ui add dev-log-tail
npx shadcn@4.17.0 add @agentic-ui/dev-log-tail
```

## Metadata

- **Level:** block
- **Category:** block
- **Installable in:** Radix UI (registry variant new-york), Base UI (registry variant base-vega)
- **Capabilities:** live-log-tail, level-filter, level-counts, search-highlight, pause-resume, virtualized-rows, follow-tail, jump-to-latest, ring-buffer, reduced-motion, dark-mode
- **Intents:** monitor-live, audit-trail
- **Suits domains:** devtools, operations, devops-status, ai-agents, saas
- **Interaction:** scroll, filter, search, pause-resume, keyboard-focus
- **Screen role:** detail
- **Density:** comfortable
- **Dark mode:** yes
- **Use it for:** live log tail with level filter, search highlighting and pause resume, virtualized log viewer that handles thousands of lines and follows the newest entry, service logs panel with debug info warn error toggles and a jump to latest button, tail application logs in the browser and search them
- **Avoid when:** colored raw command output with ANSI codes (use dev-terminal-output), a compliance audit log table with actors and diffs (use devtools-audit-log-table), historical log analytics with queries over time ranges
- **Preserve when adapting:** fixed-row-height-virtualization, pause-freezes-view, level-as-text
- **Replace when adapting:** entries, levels, source-labels
- **Adaptation effort:** low
- **Coupling:** low
- **Quality breakdown:** visual 9/10, responsive 9/10, accessibility 9/10, code 9/10
- **npm dependencies:** lucide-react
- **npm dependencies (registry):** lucide-react@0.577.0
- **Registry dependencies:** lib-primitives