Vela UI Docsvenizia.ai

alarm-minus

AlarmMinus, one of the 856 Vela UI icons, in the General group: a 24px grid drawn in currentColor, so it takes the colour of the text around it. It installs on its own as @velaui/icon-alarm-minus.

  • 16px
  • 20px
  • 24px
  • 32px

Installation

pnpm dlx velaui add @velaui/icon-alarm-minus

Usage

// components/icons/alarm-minus.tsx
import AlarmMinus from "@/components/icons/alarm-minus"

<AlarmMinus className="size-5 text-muted" />

In use

  • In a button

  • In a sentence

    Due Friday, or whenever the venue confirms.

  • In an input

  • As a badge

    Scheduled
  • In an empty state

    No events on this day yet.

    Browse blocks

Source

import * as React from "react";

export interface AlarmMinusProps extends React.SVGProps<SVGSVGElement> {
  size?: number | string;
}

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function AlarmMinus({ size = 24, strokeWidth = 1, className, ref, ...props }: AlarmMinusProps) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M2.39999 7.00839V6.24039C2.39999 4.11962 4.11922 2.40039 6.23999 2.40039H7.00799M16.992 2.40039L17.76 2.40039C19.8808 2.40039 21.6 4.11962 21.6 6.24039V7.00839M5.85599 18.9124L3.16799 21.6004M20.832 21.6004L18.144 18.9124M15 12.6004H8.99999M20.448 12.7684C20.448 17.4341 16.6657 21.2164 12 21.2164C7.33429 21.2164 3.55199 17.4341 3.55199 12.7684C3.55199 8.10269 7.33429 4.32039 12 4.32039C16.6657 4.32039 20.448 8.10269 20.448 12.7684Z" stroke="currentColor" strokeLinecap="round"/>
    </svg>
  );
}
AlarmMinus.displayName = "AlarmMinus";

export default AlarmMinus;