Vela UI Docs
venizia.ai

phone-call-02

PhoneCall02, one of the 856 Vela UI icons, in the Communication 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-phone-call-02.

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

Installation

pnpm dlx velaui add @velaui/icon-phone-call-02

Usage

// components/icons/phone-call-02.tsx
import PhoneCall02 from "@/components/icons/phone-call-02"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function PhoneCall02({ size = 24, strokeWidth = 1, className, ref, ...props }: PhoneCall02Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M8.79007 9.07148C9.66415 8.44833 10.6978 8.12187 11.7824 8.12076C12.8671 8.11965 13.8972 8.44685 14.7729 9.06536M6.45496 6.50775C8.01173 5.40151 9.85626 4.81733 11.783 4.8125C13.7126 4.81053 15.553 5.3938 17.1075 6.49686M2.41946 18.2665C2.41946 18.2665 2.43234 16.8336 2.40134 16.4483C2.38197 15.8517 2.57656 15.3663 3.0223 14.9206C3.06516 14.8777 3.11088 14.832 3.15659 14.792C4.05939 13.9975 5.17877 13.5397 6.05253 13.2305C8.45107 12.3946 10.9804 12.0837 13.5662 12.3094C15.7125 12.507 17.4475 12.9391 19.0424 13.6711C20.0181 14.1154 20.6685 14.5714 21.1474 15.1361C21.4525 15.4983 21.6005 15.9034 21.6 16.3773L21.598 18.324C21.5892 18.5951 21.5119 18.815 21.3662 18.9607C21.1862 19.1407 20.9321 19.1781 20.7494 19.1783C20.7437 19.1783 20.738 19.1783 20.7323 19.1783C20.3954 19.1901 20.0615 19.1876 19.7075 19.1822C19.5277 19.1795 19.345 19.1797 19.1595 19.1771L17.601 19.1787C16.9959 19.1793 16.7164 18.8998 16.7171 18.2947C16.7172 18.1292 16.7145 17.9665 16.7176 17.8038C16.7123 17.3185 16.712 17.6952 16.7381 17.2242C16.7381 17.2128 16.741 17.2042 16.7382 17.1957C16.7387 16.7047 16.4534 16.5109 16.2395 16.3998C16.228 16.3941 16.2166 16.3884 16.2052 16.3827C15.5119 16.0951 14.7642 15.9189 13.7796 15.8029L13.7739 15.8029C12.0158 15.622 10.4286 15.6979 8.9326 16.0362C8.74131 16.0792 8.56142 16.1393 8.3901 16.1966C8.23591 16.2481 8.09029 16.2968 7.9561 16.3284C7.93897 16.3341 7.91898 16.337 7.90185 16.3427C7.75623 16.3914 7.64198 16.46 7.54769 16.5543C7.31053 16.7914 7.31023 17.0883 7.31013 17.1853L7.30899 18.3043C7.30879 18.4984 7.2714 18.7696 7.09139 18.9496C6.91424 19.1268 6.65731 19.1613 6.47178 19.1529C6.46607 19.1529 6.46607 19.1529 6.46036 19.153L3.31483 19.1562C2.72967 19.1596 2.41946 18.2665 2.41946 18.2665Z" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  );
}
PhoneCall02.displayName = "PhoneCall02";

export default PhoneCall02;