twitter icon
twitter from Unicons Monochrome by Iconscout · Monochrome · Brand Logos · Apache-2.0 Free for personal and commercial use.
- Name
- Set
- Unicons Monochrome
- Style
- Monochrome
- Category
- Brand Logos
- Viewbox
- 24×24
- License
- Apache 2.0
The same icon in other sets
twitter-fillAkar IconstwitterBootstrap IconstwitterBoxicons BrandstwitterDevicontwitter-fillEva IconstwitterFont Awesome 6 BrandstwitterFeather Iconstwittercss.ggtwitterHuge IconstwitterIconoirtwitterJam IconstwitterLine AwesometwitterMaterial Line IconstwitterSVG LogostwitterLucidetwitterMage IconstwitterMaterial Design Iconstwitter-fillMingCute IcontwitterOpenMojitwitter-fillRemix IcontwitterSimple IconstwitterSkill Iconstwitter-outlineTeenyiconstwitterUnicons
More brand logos icons from Unicons Monochrome
Use the twitter icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M22 5.796a8.2 8.2 0 0 1-2.357.646a4.12 4.12 0 0 0 1.805-2.27a8.2 8.2 0 0 1-2.606.996a4.105 4.105 0 0 0-7.097 2.808a4.2 4.2 0 0 0 .105.935a11.65 11.65 0 0 1-8.456-4.287a4.107 4.107 0 0 0 1.27 5.478a4.1 4.1 0 0 1-1.86-.513v.052a4.105 4.105 0 0 0 3.292 4.023a4 4 0 0 1-1.081.143a4 4 0 0 1-.773-.072a4.11 4.11 0 0 0 3.832 2.85A8.26 8.26 0 0 1 2 18.282a11.6 11.6 0 0 0 6.29 1.844A11.594 11.594 0 0 0 19.962 8.453q0-.267-.013-.53A8.4 8.4 0 0 0 22 5.796"/></svg>
React
import type { SVGProps } from "react";
export function UimTwitter(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M22 5.796a8.2 8.2 0 0 1-2.357.646a4.12 4.12 0 0 0 1.805-2.27a8.2 8.2 0 0 1-2.606.996a4.105 4.105 0 0 0-7.097 2.808a4.2 4.2 0 0 0 .105.935a11.65 11.65 0 0 1-8.456-4.287a4.107 4.107 0 0 0 1.27 5.478a4.1 4.1 0 0 1-1.86-.513v.052a4.105 4.105 0 0 0 3.292 4.023a4 4 0 0 1-1.081.143a4 4 0 0 1-.773-.072a4.11 4.11 0 0 0 3.832 2.85A8.26 8.26 0 0 1 2 18.282a11.6 11.6 0 0 0 6.29 1.844A11.594 11.594 0 0 0 19.962 8.453q0-.267-.013-.53A8.4 8.4 0 0 0 22 5.796"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M22 5.796a8.2 8.2 0 0 1-2.357.646a4.12 4.12 0 0 0 1.805-2.27a8.2 8.2 0 0 1-2.606.996a4.105 4.105 0 0 0-7.097 2.808a4.2 4.2 0 0 0 .105.935a11.65 11.65 0 0 1-8.456-4.287a4.107 4.107 0 0 0 1.27 5.478a4.1 4.1 0 0 1-1.86-.513v.052a4.105 4.105 0 0 0 3.292 4.023a4 4 0 0 1-1.081.143a4 4 0 0 1-.773-.072a4.11 4.11 0 0 0 3.832 2.85A8.26 8.26 0 0 1 2 18.282a11.6 11.6 0 0 0 6.29 1.844A11.594 11.594 0 0 0 19.962 8.453q0-.267-.013-.53A8.4 8.4 0 0 0 22 5.796"/></svg> </template>
CSS
.icon-twitter {
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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M22%205.796a8.2%208.2%200%200%201-2.357.646a4.12%204.12%200%200%200%201.805-2.27a8.2%208.2%200%200%201-2.606.996a4.105%204.105%200%200%200-7.097%202.808a4.2%204.2%200%200%200%20.105.935a11.65%2011.65%200%200%201-8.456-4.287a4.107%204.107%200%200%200%201.27%205.478a4.1%204.1%200%200%201-1.86-.513v.052a4.105%204.105%200%200%200%203.292%204.023a4%204%200%200%201-1.081.143a4%204%200%200%201-.773-.072a4.11%204.11%200%200%200%203.832%202.85A8.26%208.26%200%200%201%202%2018.282a11.6%2011.6%200%200%200%206.29%201.844A11.594%2011.594%200%200%200%2019.962%208.453q0-.267-.013-.53A8.4%208.4%200%200%200%2022%205.796%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M22%205.796a8.2%208.2%200%200%201-2.357.646a4.12%204.12%200%200%200%201.805-2.27a8.2%208.2%200%200%201-2.606.996a4.105%204.105%200%200%200-7.097%202.808a4.2%204.2%200%200%200%20.105.935a11.65%2011.65%200%200%201-8.456-4.287a4.107%204.107%200%200%200%201.27%205.478a4.1%204.1%200%200%201-1.86-.513v.052a4.105%204.105%200%200%200%203.292%204.023a4%204%200%200%201-1.081.143a4%204%200%200%201-.773-.072a4.11%204.11%200%200%200%203.832%202.85A8.26%208.26%200%200%201%202%2018.282a11.6%2011.6%200%200%200%206.29%201.844A11.594%2011.594%200%200%200%2019.962%208.453q0-.267-.013-.53A8.4%208.4%200%200%200%2022%205.796%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/uim/twitter.svg?color=%231a73e8&size=48
