Alert 12

PreviousNext

Information/error indicator alert with destructive background styling and informational content.

Docs
shadcn-studiocomponent

Preview

Loading preview…
registry/new-york/components/alert/alert-12.tsx
import { UserRoundXIcon } from 'lucide-react'

import { Alert, AlertTitle } from '@/registry/new-york/ui/alert'

const AlertIndicatorDestructiveDemo = () => {
  return (
    <Alert className='border-destructive bg-destructive/10 text-destructive rounded-none border-0 border-l-6'>
      <UserRoundXIcon />
      <AlertTitle>Your request to join the team is denied.</AlertTitle>
    </Alert>
  )
}

export default AlertIndicatorDestructiveDemo

Installation

npx shadcn@latest add @shadcn-studio/alert-12

Usage

import { Alert12 } from "@/components/alert-12"
<Alert12 />