twitter icon
twitter from Material Design Icons by Pictogrammers · Filled · Brand / Logo · Apache-2.0 Free for personal and commercial use.
- Name
- Set
- Material Design Icons
- Style
- Filled
- Category
- Brand / Logo
- Viewbox
- 24×24
- License
- Apache 2.0
The same icon in other sets
twitter-fillAkar Iconstwitter-outlinedAnt Design IconstwitterBootstrap IconstwitterBoxicons BrandstwitterCoreUI BrandstwitterCodiconstwitterDevicontwitter-fillEva IconstwitterFont Awesome 6 BrandstwitterFont Awesome BrandstwitterFeather Iconstwitter-solidFlowbite Iconstwittercss.ggtwitterHuge IconstwitterIconParktwitterIconPark OutlinetwitterIconPark SolidtwitterIconPark TwoTonetwitterIconoirtwitterJam IconstwitterLine AwesometwitterMaterial Line IconstwitterSVG LogostwitterLucide
More brand / logo icons from Material Design Icons
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.46 6c-.77.35-1.6.58-2.46.69c.88-.53 1.56-1.37 1.88-2.38c-.83.5-1.75.85-2.72 1.05C18.37 4.5 17.26 4 16 4c-2.35 0-4.27 1.92-4.27 4.29c0 .34.04.67.11.98C8.28 9.09 5.11 7.38 3 4.79c-.37.63-.58 1.37-.58 2.15c0 1.49.75 2.81 1.91 3.56c-.71 0-1.37-.2-1.95-.5v.03c0 2.08 1.48 3.82 3.44 4.21a4.2 4.2 0 0 1-1.93.07a4.28 4.28 0 0 0 4 2.98a8.52 8.52 0 0 1-5.33 1.84q-.51 0-1.02-.06C3.44 20.29 5.7 21 8.12 21C16 21 20.33 14.46 20.33 8.79c0-.19 0-.37-.01-.56c.84-.6 1.56-1.36 2.14-2.23"/></svg>
React
import type { SVGProps } from "react";
export function MdiTwitter(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.46 6c-.77.35-1.6.58-2.46.69c.88-.53 1.56-1.37 1.88-2.38c-.83.5-1.75.85-2.72 1.05C18.37 4.5 17.26 4 16 4c-2.35 0-4.27 1.92-4.27 4.29c0 .34.04.67.11.98C8.28 9.09 5.11 7.38 3 4.79c-.37.63-.58 1.37-.58 2.15c0 1.49.75 2.81 1.91 3.56c-.71 0-1.37-.2-1.95-.5v.03c0 2.08 1.48 3.82 3.44 4.21a4.2 4.2 0 0 1-1.93.07a4.28 4.28 0 0 0 4 2.98a8.52 8.52 0 0 1-5.33 1.84q-.51 0-1.02-.06C3.44 20.29 5.7 21 8.12 21C16 21 20.33 14.46 20.33 8.79c0-.19 0-.37-.01-.56c.84-.6 1.56-1.36 2.14-2.23"/></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.46 6c-.77.35-1.6.58-2.46.69c.88-.53 1.56-1.37 1.88-2.38c-.83.5-1.75.85-2.72 1.05C18.37 4.5 17.26 4 16 4c-2.35 0-4.27 1.92-4.27 4.29c0 .34.04.67.11.98C8.28 9.09 5.11 7.38 3 4.79c-.37.63-.58 1.37-.58 2.15c0 1.49.75 2.81 1.91 3.56c-.71 0-1.37-.2-1.95-.5v.03c0 2.08 1.48 3.82 3.44 4.21a4.2 4.2 0 0 1-1.93.07a4.28 4.28 0 0 0 4 2.98a8.52 8.52 0 0 1-5.33 1.84q-.51 0-1.02-.06C3.44 20.29 5.7 21 8.12 21C16 21 20.33 14.46 20.33 8.79c0-.19 0-.37-.01-.56c.84-.6 1.56-1.36 2.14-2.23"/></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.46%206c-.77.35-1.6.58-2.46.69c.88-.53%201.56-1.37%201.88-2.38c-.83.5-1.75.85-2.72%201.05C18.37%204.5%2017.26%204%2016%204c-2.35%200-4.27%201.92-4.27%204.29c0%20.34.04.67.11.98C8.28%209.09%205.11%207.38%203%204.79c-.37.63-.58%201.37-.58%202.15c0%201.49.75%202.81%201.91%203.56c-.71%200-1.37-.2-1.95-.5v.03c0%202.08%201.48%203.82%203.44%204.21a4.2%204.2%200%200%201-1.93.07a4.28%204.28%200%200%200%204%202.98a8.52%208.52%200%200%201-5.33%201.84q-.51%200-1.02-.06C3.44%2020.29%205.7%2021%208.12%2021C16%2021%2020.33%2014.46%2020.33%208.79c0-.19%200-.37-.01-.56c.84-.6%201.56-1.36%202.14-2.23%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.46%206c-.77.35-1.6.58-2.46.69c.88-.53%201.56-1.37%201.88-2.38c-.83.5-1.75.85-2.72%201.05C18.37%204.5%2017.26%204%2016%204c-2.35%200-4.27%201.92-4.27%204.29c0%20.34.04.67.11.98C8.28%209.09%205.11%207.38%203%204.79c-.37.63-.58%201.37-.58%202.15c0%201.49.75%202.81%201.91%203.56c-.71%200-1.37-.2-1.95-.5v.03c0%202.08%201.48%203.82%203.44%204.21a4.2%204.2%200%200%201-1.93.07a4.28%204.28%200%200%200%204%202.98a8.52%208.52%200%200%201-5.33%201.84q-.51%200-1.02-.06C3.44%2020.29%205.7%2021%208.12%2021C16%2021%2020.33%2014.46%2020.33%208.79c0-.19%200-.37-.01-.56c.84-.6%201.56-1.36%202.14-2.23%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mdi/twitter.svg?color=%231a73e8&size=48
