logo twitter icon

logo-twitter from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.

Name
logo-twitter
Set
IonIcons
Style
Regular
Viewbox
512×512
License
MIT
Aliases
logo-twitter-outline, social-twitter

The same icon in other sets

logo-twitterCarbonlogo-twitterFramework7 Iconslogo-twitterTDesign Icons

Related icons in IonIcons

logo-alipaylogo-amazonlogo-amplifylogo-androidlogo-angularlogo-appflowlogo-applelogo-apple-appstorelogo-apple-arlogo-behancelogo-bitbucketlogo-bitcoinlogo-bufferlogo-capacitorlogo-chromelogo-closed-captioninglogo-codepenlogo-css3logo-designernewslogo-deviantartlogo-discordlogo-dockerlogo-dribbblelogo-dropbox

Use the logo twitter icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M496 109.5a201.8 201.8 0 0 1-56.55 15.3a97.5 97.5 0 0 0 43.33-53.6a197.7 197.7 0 0 1-62.56 23.5A99.14 99.14 0 0 0 348.31 64c-54.42 0-98.46 43.4-98.46 96.9a93.2 93.2 0 0 0 2.54 22.1a280.7 280.7 0 0 1-203-101.3A95.7 95.7 0 0 0 36 130.4c0 33.6 17.53 63.3 44 80.7A97.5 97.5 0 0 1 35.22 199v1.2c0 47 34 86.1 79 95a100.8 100.8 0 0 1-25.94 3.4a94.4 94.4 0 0 1-18.51-1.8c12.51 38.5 48.92 66.5 92.05 67.3A199.6 199.6 0 0 1 39.5 405.6a203 203 0 0 1-23.5-1.4A278.7 278.7 0 0 0 166.74 448c181.36 0 280.44-147.7 280.44-275.8c0-4.2-.11-8.4-.31-12.5A198.5 198.5 0 0 0 496 109.5"/></svg>

React

import type { SVGProps } from "react";

export function IonLogoTwitter(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M496 109.5a201.8 201.8 0 0 1-56.55 15.3a97.5 97.5 0 0 0 43.33-53.6a197.7 197.7 0 0 1-62.56 23.5A99.14 99.14 0 0 0 348.31 64c-54.42 0-98.46 43.4-98.46 96.9a93.2 93.2 0 0 0 2.54 22.1a280.7 280.7 0 0 1-203-101.3A95.7 95.7 0 0 0 36 130.4c0 33.6 17.53 63.3 44 80.7A97.5 97.5 0 0 1 35.22 199v1.2c0 47 34 86.1 79 95a100.8 100.8 0 0 1-25.94 3.4a94.4 94.4 0 0 1-18.51-1.8c12.51 38.5 48.92 66.5 92.05 67.3A199.6 199.6 0 0 1 39.5 405.6a203 203 0 0 1-23.5-1.4A278.7 278.7 0 0 0 166.74 448c181.36 0 280.44-147.7 280.44-275.8c0-4.2-.11-8.4-.31-12.5A198.5 198.5 0 0 0 496 109.5"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M496 109.5a201.8 201.8 0 0 1-56.55 15.3a97.5 97.5 0 0 0 43.33-53.6a197.7 197.7 0 0 1-62.56 23.5A99.14 99.14 0 0 0 348.31 64c-54.42 0-98.46 43.4-98.46 96.9a93.2 93.2 0 0 0 2.54 22.1a280.7 280.7 0 0 1-203-101.3A95.7 95.7 0 0 0 36 130.4c0 33.6 17.53 63.3 44 80.7A97.5 97.5 0 0 1 35.22 199v1.2c0 47 34 86.1 79 95a100.8 100.8 0 0 1-25.94 3.4a94.4 94.4 0 0 1-18.51-1.8c12.51 38.5 48.92 66.5 92.05 67.3A199.6 199.6 0 0 1 39.5 405.6a203 203 0 0 1-23.5-1.4A278.7 278.7 0 0 0 166.74 448c181.36 0 280.44-147.7 280.44-275.8c0-4.2-.11-8.4-.31-12.5A198.5 198.5 0 0 0 496 109.5"/></svg>
</template>

CSS

.icon-logo-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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M496%20109.5a201.8%20201.8%200%200%201-56.55%2015.3a97.5%2097.5%200%200%200%2043.33-53.6a197.7%20197.7%200%200%201-62.56%2023.5A99.14%2099.14%200%200%200%20348.31%2064c-54.42%200-98.46%2043.4-98.46%2096.9a93.2%2093.2%200%200%200%202.54%2022.1a280.7%20280.7%200%200%201-203-101.3A95.7%2095.7%200%200%200%2036%20130.4c0%2033.6%2017.53%2063.3%2044%2080.7A97.5%2097.5%200%200%201%2035.22%20199v1.2c0%2047%2034%2086.1%2079%2095a100.8%20100.8%200%200%201-25.94%203.4a94.4%2094.4%200%200%201-18.51-1.8c12.51%2038.5%2048.92%2066.5%2092.05%2067.3A199.6%20199.6%200%200%201%2039.5%20405.6a203%20203%200%200%201-23.5-1.4A278.7%20278.7%200%200%200%20166.74%20448c181.36%200%20280.44-147.7%20280.44-275.8c0-4.2-.11-8.4-.31-12.5A198.5%20198.5%200%200%200%20496%20109.5%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M496%20109.5a201.8%20201.8%200%200%201-56.55%2015.3a97.5%2097.5%200%200%200%2043.33-53.6a197.7%20197.7%200%200%201-62.56%2023.5A99.14%2099.14%200%200%200%20348.31%2064c-54.42%200-98.46%2043.4-98.46%2096.9a93.2%2093.2%200%200%200%202.54%2022.1a280.7%20280.7%200%200%201-203-101.3A95.7%2095.7%200%200%200%2036%20130.4c0%2033.6%2017.53%2063.3%2044%2080.7A97.5%2097.5%200%200%201%2035.22%20199v1.2c0%2047%2034%2086.1%2079%2095a100.8%20100.8%200%200%201-25.94%203.4a94.4%2094.4%200%200%201-18.51-1.8c12.51%2038.5%2048.92%2066.5%2092.05%2067.3A199.6%20199.6%200%200%201%2039.5%20405.6a203%20203%200%200%201-23.5-1.4A278.7%20278.7%200%200%200%20166.74%20448c181.36%200%20280.44-147.7%20280.44-275.8c0-4.2-.11-8.4-.31-12.5A198.5%20198.5%200%200%200%20496%20109.5%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/logo-twitter.svg?color=%231a73e8&size=48

Logo Twitter icon — IonIcons · IconsDB