twitter logo icon
twitter-logo from Phosphor by Phosphor Icons · Regular · MIT Free for personal and commercial use.
- Name
- twitter-logo
- Set
- Phosphor
- Style
- Regular
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
Use the twitter logo icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M247.39 68.94A8 8 0 0 0 240 64h-30.43a48.66 48.66 0 0 0-41.47-24a46.9 46.9 0 0 0-33.75 13.7A47.9 47.9 0 0 0 120 88v6.09C79.74 83.47 46.81 50.72 46.46 50.37a8 8 0 0 0-13.65 4.92c-4.31 47.79 9.57 79.77 22 98.18a111 111 0 0 0 21.88 24.2c-15.23 17.53-39.21 26.74-39.47 26.84a8 8 0 0 0-3.85 11.93c.75 1.12 3.75 5.05 11.08 8.72C53.51 229.7 65.48 232 80 232c70.67 0 129.72-54.42 135.75-124.44l29.91-29.9a8 8 0 0 0 1.73-8.72m-45 29.41a8 8 0 0 0-2.32 5.14C196 166.58 143.28 216 80 216c-10.56 0-18-1.4-23.22-3.08c11.51-6.25 27.56-17 37.88-32.48A8 8 0 0 0 92 169.08c-.47-.27-43.91-26.34-44-96c16 13 45.25 33.17 78.67 38.79A8 8 0 0 0 136 104V88a32 32 0 0 1 9.6-22.92A30.94 30.94 0 0 1 167.9 56c12.66.16 24.49 7.88 29.44 19.21a8 8 0 0 0 7.33 4.79h16Z"/></svg>
React
import type { SVGProps } from "react";
export function PhTwitterLogo(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M247.39 68.94A8 8 0 0 0 240 64h-30.43a48.66 48.66 0 0 0-41.47-24a46.9 46.9 0 0 0-33.75 13.7A47.9 47.9 0 0 0 120 88v6.09C79.74 83.47 46.81 50.72 46.46 50.37a8 8 0 0 0-13.65 4.92c-4.31 47.79 9.57 79.77 22 98.18a111 111 0 0 0 21.88 24.2c-15.23 17.53-39.21 26.74-39.47 26.84a8 8 0 0 0-3.85 11.93c.75 1.12 3.75 5.05 11.08 8.72C53.51 229.7 65.48 232 80 232c70.67 0 129.72-54.42 135.75-124.44l29.91-29.9a8 8 0 0 0 1.73-8.72m-45 29.41a8 8 0 0 0-2.32 5.14C196 166.58 143.28 216 80 216c-10.56 0-18-1.4-23.22-3.08c11.51-6.25 27.56-17 37.88-32.48A8 8 0 0 0 92 169.08c-.47-.27-43.91-26.34-44-96c16 13 45.25 33.17 78.67 38.79A8 8 0 0 0 136 104V88a32 32 0 0 1 9.6-22.92A30.94 30.94 0 0 1 167.9 56c12.66.16 24.49 7.88 29.44 19.21a8 8 0 0 0 7.33 4.79h16Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M247.39 68.94A8 8 0 0 0 240 64h-30.43a48.66 48.66 0 0 0-41.47-24a46.9 46.9 0 0 0-33.75 13.7A47.9 47.9 0 0 0 120 88v6.09C79.74 83.47 46.81 50.72 46.46 50.37a8 8 0 0 0-13.65 4.92c-4.31 47.79 9.57 79.77 22 98.18a111 111 0 0 0 21.88 24.2c-15.23 17.53-39.21 26.74-39.47 26.84a8 8 0 0 0-3.85 11.93c.75 1.12 3.75 5.05 11.08 8.72C53.51 229.7 65.48 232 80 232c70.67 0 129.72-54.42 135.75-124.44l29.91-29.9a8 8 0 0 0 1.73-8.72m-45 29.41a8 8 0 0 0-2.32 5.14C196 166.58 143.28 216 80 216c-10.56 0-18-1.4-23.22-3.08c11.51-6.25 27.56-17 37.88-32.48A8 8 0 0 0 92 169.08c-.47-.27-43.91-26.34-44-96c16 13 45.25 33.17 78.67 38.79A8 8 0 0 0 136 104V88a32 32 0 0 1 9.6-22.92A30.94 30.94 0 0 1 167.9 56c12.66.16 24.49 7.88 29.44 19.21a8 8 0 0 0 7.33 4.79h16Z"/></svg> </template>
CSS
.icon-twitter-logo {
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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M247.39%2068.94A8%208%200%200%200%20240%2064h-30.43a48.66%2048.66%200%200%200-41.47-24a46.9%2046.9%200%200%200-33.75%2013.7A47.9%2047.9%200%200%200%20120%2088v6.09C79.74%2083.47%2046.81%2050.72%2046.46%2050.37a8%208%200%200%200-13.65%204.92c-4.31%2047.79%209.57%2079.77%2022%2098.18a111%20111%200%200%200%2021.88%2024.2c-15.23%2017.53-39.21%2026.74-39.47%2026.84a8%208%200%200%200-3.85%2011.93c.75%201.12%203.75%205.05%2011.08%208.72C53.51%20229.7%2065.48%20232%2080%20232c70.67%200%20129.72-54.42%20135.75-124.44l29.91-29.9a8%208%200%200%200%201.73-8.72m-45%2029.41a8%208%200%200%200-2.32%205.14C196%20166.58%20143.28%20216%2080%20216c-10.56%200-18-1.4-23.22-3.08c11.51-6.25%2027.56-17%2037.88-32.48A8%208%200%200%200%2092%20169.08c-.47-.27-43.91-26.34-44-96c16%2013%2045.25%2033.17%2078.67%2038.79A8%208%200%200%200%20136%20104V88a32%2032%200%200%201%209.6-22.92A30.94%2030.94%200%200%201%20167.9%2056c12.66.16%2024.49%207.88%2029.44%2019.21a8%208%200%200%200%207.33%204.79h16Z%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M247.39%2068.94A8%208%200%200%200%20240%2064h-30.43a48.66%2048.66%200%200%200-41.47-24a46.9%2046.9%200%200%200-33.75%2013.7A47.9%2047.9%200%200%200%20120%2088v6.09C79.74%2083.47%2046.81%2050.72%2046.46%2050.37a8%208%200%200%200-13.65%204.92c-4.31%2047.79%209.57%2079.77%2022%2098.18a111%20111%200%200%200%2021.88%2024.2c-15.23%2017.53-39.21%2026.74-39.47%2026.84a8%208%200%200%200-3.85%2011.93c.75%201.12%203.75%205.05%2011.08%208.72C53.51%20229.7%2065.48%20232%2080%20232c70.67%200%20129.72-54.42%20135.75-124.44l29.91-29.9a8%208%200%200%200%201.73-8.72m-45%2029.41a8%208%200%200%200-2.32%205.14C196%20166.58%20143.28%20216%2080%20216c-10.56%200-18-1.4-23.22-3.08c11.51-6.25%2027.56-17%2037.88-32.48A8%208%200%200%200%2092%20169.08c-.47-.27-43.91-26.34-44-96c16%2013%2045.25%2033.17%2078.67%2038.79A8%208%200%200%200%20136%20104V88a32%2032%200%200%201%209.6-22.92A30.94%2030.94%200%200%201%20167.9%2056c12.66.16%2024.49%207.88%2029.44%2019.21a8%208%200%200%200%207.33%204.79h16Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/twitter-logo.svg?color=%231a73e8&size=48
