Signal icon
Download the Signal logo as free SVG or PNG. Compare outline and filled styles. Copy React, Vue or Svelte code.
- signal
- messenger
- messaging
- chat
- private
- encrypted
- secure
- logo
- brand
- social
Style
Size
Stroke
Filled icons have no stroke
Color
- Category
- brand
- Styles
- Outline, filled
- Component
- IconBrandSignal
- License
- MIT · Paweł Kuna
Code
Copy it the way you use it
brand-signal.svg
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M2.708 22.726l.148 -.034l.822 -.191m2.754 -.642l.472 -.11c.485 .254 .987 .469 1.501 .647m2.939 .584c.218 .013 .437 .02 .656 .02c.22 0 .439 -.008 .657 -.02m2.939 -.583c.418 -.144 .824 -.312 1.217 -.504m2.484 -1.663c.329 -.292 .641 -.604 .933 -.933m1.663 -2.485c.192 -.393 .36 -.799 .505 -1.216m.582 -2.94c.012 -.217 .02 -.436 .02 -.656c0 -.22 -.008 -.439 -.02 -.657m-.583 -2.939c-.144 -.418 -.313 -.824 -.504 -1.217m-1.663 -2.484c-.292 -.329 -.604 -.641 -.933 -.933m-2.485 -1.663c-.393 -.192 -.799 -.36 -1.216 -.505m-2.94 -.582c-.217 -.012 -.436 -.02 -.656 -.02c-.22 0 -.439 .008 -.657 .02m-2.939 .583c-.418 .144 -.824 .313 -1.217 .504m-2.484 1.663c-.329 .292 -.641 .604 -.933 .933m-1.663 2.485c-.192 .393 -.36 .799 -.505 1.216m-.582 2.94c-.012 .217 -.02 .436 -.02 .656c0 .219 .007 .438 .02 .657m.584 2.939c.178 .514 .394 1.016 .648 1.501l-.11 .471m-.643 2.754l-.217 .93l-.009 .039c-.15 .643 .249 1.286 .892 1.436c.179 .041 .365 .041 .543 -.001" />
<path d="M4.848 19.152l2.446 -.57l.993 .519c.56 .292 1.167 .519 1.805 .675c.597 .149 1.238 .223 1.908 .223c2.21 0 4.21 -.895 5.657 -2.342c1.447 -1.447 2.342 -3.447 2.342 -5.657c0 -2.21 -.895 -4.21 -2.342 -5.657c-1.447 -1.447 -3.447 -2.342 -5.657 -2.342c-2.21 0 -4.21 .895 -5.657 2.342c-1.447 1.447 -2.342 3.447 -2.342 5.657c0 .666 .075 1.308 .223 1.909c.156 .637 .383 1.244 .676 1.805l.519 .993l-.571 2.445" />
</svg> Use the Signal icon
For a decorative icon beside text, add aria-hidden="true" to the SVG. For an icon-only control, put its accessible name on the button or link.
React example
import { IconBrandSignal } from '@tabler/icons-react';
<IconBrandSignal size={24} stroke={2} />Read the React guideVue example
import { IconBrandSignal } from '@tabler/icons-vue';
<IconBrandSignal :size="24" :stroke="2" />Read the Vue guideSvelte 5 example
import { IconBrandSignal } from '@tabler/icons-svelte-runes';
<IconBrandSignal size={24} stroke={2} />Read the Svelte guideRelated