radio icon
radio from IconPark TwoTone by ByteDance · Two tone · Hardware · Apache-2.0 Free for personal and commercial use.
- Name
- radio
- Set
- IconPark TwoTone
- Style
- Two tone
- Category
- Hardware
- Viewbox
- 48×48
- License
- Apache 2.0
The same icon in other sets
radioAkar IconsradioBoxIcons v2radioBoxIcons v2 SolidradioCarbonradioEmoji One (Colored)radio-fillEva IconsradioFont Awesome 6 SolidradioFont Awesome SolidradioFeather IconsradioFluent EmojiradioFluent Emoji FlatradioFluent Emoji High ContrastradioFirefox OS EmojiradioHeroIconsradioHuge IconsradioHumbleiconsradioIconParkradioIconPark OutlineradioIconPark SolidradioIonIconsradioLucideradioMaterial SymbolsradioMaterial Symbols LightradioMaterial Design Icons
More hardware icons from IconPark TwoTone
Use the radio icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><defs><mask id="SVGzZDDPcyC"><g fill="none" stroke="#fff" stroke-width="4"><rect width="38" height="28" x="5" y="13" fill="#555" rx="2"/><circle cx="18" cy="28" r="6" fill="#555"/><path stroke-linecap="round" stroke-linejoin="round" d="M30 24h6m-6 8h6M7 13l18-9"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVGzZDDPcyC)"/></svg>
React
import type { SVGProps } from "react";
export function IconParkTwotoneRadio(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><defs><mask id="SVGzZDDPcyC"><g fill="none" stroke="#fff" strokeWidth="4"><rect width="38" height="28" x="5" y="13" fill="#555" rx="2"/><circle cx="18" cy="28" r="6" fill="#555"/><path strokeLinecap="round" strokeLinejoin="round" d="M30 24h6m-6 8h6M7 13l18-9"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVGzZDDPcyC)"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><defs><mask id="SVGzZDDPcyC"><g fill="none" stroke="#fff" stroke-width="4"><rect width="38" height="28" x="5" y="13" fill="#555" rx="2"/><circle cx="18" cy="28" r="6" fill="#555"/><path stroke-linecap="round" stroke-linejoin="round" d="M30 24h6m-6 8h6M7 13l18-9"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVGzZDDPcyC)"/></svg> </template>
CSS
.icon-radio {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cmask%20id%3D%22SVGzZDDPcyC%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%224%22%3E%3Crect%20width%3D%2238%22%20height%3D%2228%22%20x%3D%225%22%20y%3D%2213%22%20fill%3D%22%23555%22%20rx%3D%222%22%2F%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2228%22%20r%3D%226%22%20fill%3D%22%23555%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M30%2024h6m-6%208h6M7%2013l18-9%22%2F%3E%3C%2Fg%3E%3C%2Fmask%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M0%200h48v48H0z%22%20mask%3D%22url(%23SVGzZDDPcyC)%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cmask%20id%3D%22SVGzZDDPcyC%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%224%22%3E%3Crect%20width%3D%2238%22%20height%3D%2228%22%20x%3D%225%22%20y%3D%2213%22%20fill%3D%22%23555%22%20rx%3D%222%22%2F%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2228%22%20r%3D%226%22%20fill%3D%22%23555%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M30%2024h6m-6%208h6M7%2013l18-9%22%2F%3E%3C%2Fg%3E%3C%2Fmask%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M0%200h48v48H0z%22%20mask%3D%22url(%23SVGzZDDPcyC)%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/icon-park-twotone/radio.svg?color=%231a73e8&size=48