Bot Radar is a rotating radar sweep with range rings and crosshairs where user blips glow emerald as the beam passes and bot blips flash red with a blocked label. The sweep loops continuously, so the block reads as a live security feed at a glance. Built with Framer Motion and React. Card title and description are props, making it a natural fit for bot protection and fraud prevention feature grids.
Installation
Install dependencies.
Copy and paste the following code into your project.
Unlock the full library
Get all pro blocks, components & illustrations, and production-ready Next.js + Tailwind templates.
Update the import paths to match your project setup.
Usage
import BotRadar from "@/components/pro/blocks/bot-radar";<BotRadar />Props
| Prop | Type | Default | Description |
|---|---|---|---|
cardTitle | string | "Bot Detection" | Title shown in the card overlay. |
cardDescription | string | "Keep bad actors and abuse away via IP blocklisting, machine learning and other measures." | Description shown in the card overlay. |