Vela UI Docs
venizia.ai

stopwatch-off

StopwatchOff, 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-stopwatch-off.

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

Installation

pnpm dlx velaui add @velaui/icon-stopwatch-off

Usage

// components/icons/stopwatch-off.tsx
import StopwatchOff from "@/components/icons/stopwatch-off"

<StopwatchOff 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 StopwatchOffProps extends React.SVGProps<SVGSVGElement> {
  size?: number | string;
}

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function StopwatchOff({ size = 24, strokeWidth = 1, className, ref, ...props }: StopwatchOffProps) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M2.40002 3.68696L21 22.287M18.2609 6.85217L20.3478 4.76522M21.6 6.01739L20.3478 4.76522L19.0957 3.51304M9.50002 2H14.5M5.42172 8C4.22071 9.47819 3.50002 11.3685 3.50002 13.4286C3.50002 18.1624 7.3056 22 12 22C14.0975 22 16.0176 21.2339 17.5 19.964M20 16.3319C20.3237 15.4252 20.5 14.4477 20.5 13.4286C20.5 8.6947 16.6944 4.85714 12 4.85714C10.944 4.85714 9.93291 5.05135 9.00002 5.40627" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  );
}
StopwatchOff.displayName = "StopwatchOff";

export default StopwatchOff;