tiktok icon
tiktok from Mage Icons by MageIcons · Outline · Apache-2.0 Free for personal and commercial use.
- Name
- tiktok
- Set
- Mage Icons
- Style
- Outline
- Viewbox
- 24×24
- License
- Apache 2.0
The same icon in other sets
tiktok-fillAkar IconstiktokBootstrap IconstiktokBoxicons BrandstiktokCoreUI BrandstiktokFont Awesome 6 BrandstiktokFont Awesome BrandstiktokHuge IconstiktokIconParktiktokIconPark OutlinetiktokIconPark SolidtiktokIconPark TwoTonetiktokIconoirtiktokMaterial Line IconstiktokSVG Logostiktok-fillMingCute IcontiktokPixelarticonstiktokPrime Iconstiktok-fillRemix IcontiktokSimple Iconstiktok-outlineTeenyicons
Related icons in Mage Icons
Use the tiktok icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M20.357 7.75a.537.537 0 0 0-.495-.516a4.7 4.7 0 0 1-2.415-.938a4.85 4.85 0 0 1-1.887-3.3a.54.54 0 0 0-.517-.496h-2.108a.517.517 0 0 0-.517.527v12.59a2.794 2.794 0 0 1-2.974 2.762a2.815 2.815 0 0 1-2.51-3.711A2.836 2.836 0 0 1 9.93 12.78a.506.506 0 0 0 .558-.506V9.807s-.896-.063-1.202-.063a5.27 5.27 0 0 0-4.101 1.93a5.8 5.8 0 0 0-1.37 2.52a5.86 5.86 0 0 0 2.14 6.072A5.93 5.93 0 0 0 9.591 21.5q.451 0 .896-.063A5.95 5.95 0 0 0 13.8 19.78a5.84 5.84 0 0 0 1.75-4.133V8.71a7.84 7.84 0 0 0 4.218 1.613a.517.517 0 0 0 .548-.527V7.751z"/></svg>
React
import type { SVGProps } from "react";
export function MageTiktok(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="M20.357 7.75a.537.537 0 0 0-.495-.516a4.7 4.7 0 0 1-2.415-.938a4.85 4.85 0 0 1-1.887-3.3a.54.54 0 0 0-.517-.496h-2.108a.517.517 0 0 0-.517.527v12.59a2.794 2.794 0 0 1-2.974 2.762a2.815 2.815 0 0 1-2.51-3.711A2.836 2.836 0 0 1 9.93 12.78a.506.506 0 0 0 .558-.506V9.807s-.896-.063-1.202-.063a5.27 5.27 0 0 0-4.101 1.93a5.8 5.8 0 0 0-1.37 2.52a5.86 5.86 0 0 0 2.14 6.072A5.93 5.93 0 0 0 9.591 21.5q.451 0 .896-.063A5.95 5.95 0 0 0 13.8 19.78a5.84 5.84 0 0 0 1.75-4.133V8.71a7.84 7.84 0 0 0 4.218 1.613a.517.517 0 0 0 .548-.527V7.751z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M20.357 7.75a.537.537 0 0 0-.495-.516a4.7 4.7 0 0 1-2.415-.938a4.85 4.85 0 0 1-1.887-3.3a.54.54 0 0 0-.517-.496h-2.108a.517.517 0 0 0-.517.527v12.59a2.794 2.794 0 0 1-2.974 2.762a2.815 2.815 0 0 1-2.51-3.711A2.836 2.836 0 0 1 9.93 12.78a.506.506 0 0 0 .558-.506V9.807s-.896-.063-1.202-.063a5.27 5.27 0 0 0-4.101 1.93a5.8 5.8 0 0 0-1.37 2.52a5.86 5.86 0 0 0 2.14 6.072A5.93 5.93 0 0 0 9.591 21.5q.451 0 .896-.063A5.95 5.95 0 0 0 13.8 19.78a5.84 5.84 0 0 0 1.75-4.133V8.71a7.84 7.84 0 0 0 4.218 1.613a.517.517 0 0 0 .548-.527V7.751z"/></svg> </template>
CSS
.icon-tiktok {
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%22M20.357%207.75a.537.537%200%200%200-.495-.516a4.7%204.7%200%200%201-2.415-.938a4.85%204.85%200%200%201-1.887-3.3a.54.54%200%200%200-.517-.496h-2.108a.517.517%200%200%200-.517.527v12.59a2.794%202.794%200%200%201-2.974%202.762a2.815%202.815%200%200%201-2.51-3.711A2.836%202.836%200%200%201%209.93%2012.78a.506.506%200%200%200%20.558-.506V9.807s-.896-.063-1.202-.063a5.27%205.27%200%200%200-4.101%201.93a5.8%205.8%200%200%200-1.37%202.52a5.86%205.86%200%200%200%202.14%206.072A5.93%205.93%200%200%200%209.591%2021.5q.451%200%20.896-.063A5.95%205.95%200%200%200%2013.8%2019.78a5.84%205.84%200%200%200%201.75-4.133V8.71a7.84%207.84%200%200%200%204.218%201.613a.517.517%200%200%200%20.548-.527V7.751z%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%22M20.357%207.75a.537.537%200%200%200-.495-.516a4.7%204.7%200%200%201-2.415-.938a4.85%204.85%200%200%201-1.887-3.3a.54.54%200%200%200-.517-.496h-2.108a.517.517%200%200%200-.517.527v12.59a2.794%202.794%200%200%201-2.974%202.762a2.815%202.815%200%200%201-2.51-3.711A2.836%202.836%200%200%201%209.93%2012.78a.506.506%200%200%200%20.558-.506V9.807s-.896-.063-1.202-.063a5.27%205.27%200%200%200-4.101%201.93a5.8%205.8%200%200%200-1.37%202.52a5.86%205.86%200%200%200%202.14%206.072A5.93%205.93%200%200%200%209.591%2021.5q.451%200%20.896-.063A5.95%205.95%200%200%200%2013.8%2019.78a5.84%205.84%200%200%200%201.75-4.133V8.71a7.84%207.84%200%200%200%204.218%201.613a.517.517%200%200%200%20.548-.527V7.751z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mage/tiktok.svg?color=%231a73e8&size=48
