Vela UI Docsvenizia.ai

wifi-off

WifiOff, 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-wifi-off.

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

Installation

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

Usage

// components/icons/wifi-off.tsx
import WifiOff from "@/components/icons/wifi-off"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function WifiOff({ size = 24, strokeWidth = 1, className, ref, ...props }: WifiOffProps) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M9.00596 16.1345C10.6599 14.5519 13.3414 14.5519 14.9953 16.1345M12.0006 19L12.0182 18.9832M6.01129 13.269C7.23355 12.0994 8.73641 11.362 10.3125 11.0568M15.375 11.5636C16.3244 11.9578 17.2138 12.5262 17.99 13.269M12.5625 7.18084C15.6299 7.30988 18.6578 8.49499 21 10.7362M3 10.7362C4.11482 9.66942 5.385 8.84193 6.74084 8.2537M17.0625 18.0141L4.6875 5" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  );
}
WifiOff.displayName = "WifiOff";

export default WifiOff;