tiktok icon logo

tiktok-icon from SVG Logos by Gil Barbara · Color · CC0-1.0 Free for personal and commercial use.

Name
tiktok-icon
Set
SVG Logos
Style
Color
Viewbox
256×290
License
CC0

Use the tiktok icon logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 290"><path fill="#ff004f" d="M189.72 104.421c18.678 13.345 41.56 21.197 66.273 21.197v-47.53a67 67 0 0 1-13.918-1.456v37.413c-24.711 0-47.59-7.851-66.272-21.195v96.996c0 48.523-39.356 87.855-87.9 87.855c-18.113 0-34.949-5.473-48.934-14.86c15.962 16.313 38.222 26.432 62.848 26.432c48.548 0 87.905-39.332 87.905-87.857v-96.995zm17.17-47.952c-9.546-10.423-15.814-23.893-17.17-38.785v-6.113h-13.189c3.32 18.927 14.644 35.097 30.358 44.898M69.673 225.607a40 40 0 0 1-8.203-24.33c0-22.192 18.001-40.186 40.21-40.186a40.3 40.3 0 0 1 12.197 1.883v-48.593c-4.61-.631-9.262-.9-13.912-.801v37.822a40.3 40.3 0 0 0-12.203-1.882c-22.208 0-40.208 17.992-40.208 40.187c0 15.694 8.997 29.281 22.119 35.9"/><path d="M175.803 92.849c18.683 13.344 41.56 21.195 66.272 21.195V76.631c-13.794-2.937-26.005-10.141-35.186-20.162c-15.715-9.802-27.038-25.972-30.358-44.898h-34.643v189.843c-.079 22.132-18.049 40.052-40.21 40.052c-13.058 0-24.66-6.221-32.007-15.86c-13.12-6.618-22.118-20.206-22.118-35.898c0-22.193 18-40.187 40.208-40.187c4.255 0 8.356.662 12.203 1.882v-37.822c-47.692.985-86.047 39.933-86.047 87.834c0 23.912 9.551 45.589 25.053 61.428c13.985 9.385 30.82 14.86 48.934 14.86c48.545 0 87.9-39.335 87.9-87.857z"/><path fill="#00f2ea" d="M242.075 76.63V66.516a66.3 66.3 0 0 1-35.186-10.047a66.47 66.47 0 0 0 35.186 20.163M176.53 11.57a68 68 0 0 1-.728-5.457V0h-47.834v189.845c-.076 22.13-18.046 40.05-40.208 40.05a40.06 40.06 0 0 1-18.09-4.287c7.347 9.637 18.949 15.857 32.007 15.857c22.16 0 40.132-17.918 40.21-40.05V11.571zM99.966 113.58v-10.769a89 89 0 0 0-12.061-.818C39.355 101.993 0 141.327 0 189.845c0 30.419 15.467 57.227 38.971 72.996c-15.502-15.838-25.053-37.516-25.053-61.427c0-47.9 38.354-86.848 86.048-87.833"/></svg>

React

import type { SVGProps } from "react";

export function LogosTiktokIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 290"><path fill="#ff004f" d="M189.72 104.421c18.678 13.345 41.56 21.197 66.273 21.197v-47.53a67 67 0 0 1-13.918-1.456v37.413c-24.711 0-47.59-7.851-66.272-21.195v96.996c0 48.523-39.356 87.855-87.9 87.855c-18.113 0-34.949-5.473-48.934-14.86c15.962 16.313 38.222 26.432 62.848 26.432c48.548 0 87.905-39.332 87.905-87.857v-96.995zm17.17-47.952c-9.546-10.423-15.814-23.893-17.17-38.785v-6.113h-13.189c3.32 18.927 14.644 35.097 30.358 44.898M69.673 225.607a40 40 0 0 1-8.203-24.33c0-22.192 18.001-40.186 40.21-40.186a40.3 40.3 0 0 1 12.197 1.883v-48.593c-4.61-.631-9.262-.9-13.912-.801v37.822a40.3 40.3 0 0 0-12.203-1.882c-22.208 0-40.208 17.992-40.208 40.187c0 15.694 8.997 29.281 22.119 35.9"/><path d="M175.803 92.849c18.683 13.344 41.56 21.195 66.272 21.195V76.631c-13.794-2.937-26.005-10.141-35.186-20.162c-15.715-9.802-27.038-25.972-30.358-44.898h-34.643v189.843c-.079 22.132-18.049 40.052-40.21 40.052c-13.058 0-24.66-6.221-32.007-15.86c-13.12-6.618-22.118-20.206-22.118-35.898c0-22.193 18-40.187 40.208-40.187c4.255 0 8.356.662 12.203 1.882v-37.822c-47.692.985-86.047 39.933-86.047 87.834c0 23.912 9.551 45.589 25.053 61.428c13.985 9.385 30.82 14.86 48.934 14.86c48.545 0 87.9-39.335 87.9-87.857z"/><path fill="#00f2ea" d="M242.075 76.63V66.516a66.3 66.3 0 0 1-35.186-10.047a66.47 66.47 0 0 0 35.186 20.163M176.53 11.57a68 68 0 0 1-.728-5.457V0h-47.834v189.845c-.076 22.13-18.046 40.05-40.208 40.05a40.06 40.06 0 0 1-18.09-4.287c7.347 9.637 18.949 15.857 32.007 15.857c22.16 0 40.132-17.918 40.21-40.05V11.571zM99.966 113.58v-10.769a89 89 0 0 0-12.061-.818C39.355 101.993 0 141.327 0 189.845c0 30.419 15.467 57.227 38.971 72.996c-15.502-15.838-25.053-37.516-25.053-61.427c0-47.9 38.354-86.848 86.048-87.833"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 290"><path fill="#ff004f" d="M189.72 104.421c18.678 13.345 41.56 21.197 66.273 21.197v-47.53a67 67 0 0 1-13.918-1.456v37.413c-24.711 0-47.59-7.851-66.272-21.195v96.996c0 48.523-39.356 87.855-87.9 87.855c-18.113 0-34.949-5.473-48.934-14.86c15.962 16.313 38.222 26.432 62.848 26.432c48.548 0 87.905-39.332 87.905-87.857v-96.995zm17.17-47.952c-9.546-10.423-15.814-23.893-17.17-38.785v-6.113h-13.189c3.32 18.927 14.644 35.097 30.358 44.898M69.673 225.607a40 40 0 0 1-8.203-24.33c0-22.192 18.001-40.186 40.21-40.186a40.3 40.3 0 0 1 12.197 1.883v-48.593c-4.61-.631-9.262-.9-13.912-.801v37.822a40.3 40.3 0 0 0-12.203-1.882c-22.208 0-40.208 17.992-40.208 40.187c0 15.694 8.997 29.281 22.119 35.9"/><path d="M175.803 92.849c18.683 13.344 41.56 21.195 66.272 21.195V76.631c-13.794-2.937-26.005-10.141-35.186-20.162c-15.715-9.802-27.038-25.972-30.358-44.898h-34.643v189.843c-.079 22.132-18.049 40.052-40.21 40.052c-13.058 0-24.66-6.221-32.007-15.86c-13.12-6.618-22.118-20.206-22.118-35.898c0-22.193 18-40.187 40.208-40.187c4.255 0 8.356.662 12.203 1.882v-37.822c-47.692.985-86.047 39.933-86.047 87.834c0 23.912 9.551 45.589 25.053 61.428c13.985 9.385 30.82 14.86 48.934 14.86c48.545 0 87.9-39.335 87.9-87.857z"/><path fill="#00f2ea" d="M242.075 76.63V66.516a66.3 66.3 0 0 1-35.186-10.047a66.47 66.47 0 0 0 35.186 20.163M176.53 11.57a68 68 0 0 1-.728-5.457V0h-47.834v189.845c-.076 22.13-18.046 40.05-40.208 40.05a40.06 40.06 0 0 1-18.09-4.287c7.347 9.637 18.949 15.857 32.007 15.857c22.16 0 40.132-17.918 40.21-40.05V11.571zM99.966 113.58v-10.769a89 89 0 0 0-12.061-.818C39.355 101.993 0 141.327 0 189.845c0 30.419 15.467 57.227 38.971 72.996c-15.502-15.838-25.053-37.516-25.053-61.427c0-47.9 38.354-86.848 86.048-87.833"/></svg>
</template>

CSS

.icon-tiktok-icon {
  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%20290%22%3E%3Cpath%20fill%3D%22%23ff004f%22%20d%3D%22M189.72%20104.421c18.678%2013.345%2041.56%2021.197%2066.273%2021.197v-47.53a67%2067%200%200%201-13.918-1.456v37.413c-24.711%200-47.59-7.851-66.272-21.195v96.996c0%2048.523-39.356%2087.855-87.9%2087.855c-18.113%200-34.949-5.473-48.934-14.86c15.962%2016.313%2038.222%2026.432%2062.848%2026.432c48.548%200%2087.905-39.332%2087.905-87.857v-96.995zm17.17-47.952c-9.546-10.423-15.814-23.893-17.17-38.785v-6.113h-13.189c3.32%2018.927%2014.644%2035.097%2030.358%2044.898M69.673%20225.607a40%2040%200%200%201-8.203-24.33c0-22.192%2018.001-40.186%2040.21-40.186a40.3%2040.3%200%200%201%2012.197%201.883v-48.593c-4.61-.631-9.262-.9-13.912-.801v37.822a40.3%2040.3%200%200%200-12.203-1.882c-22.208%200-40.208%2017.992-40.208%2040.187c0%2015.694%208.997%2029.281%2022.119%2035.9%22%2F%3E%3Cpath%20d%3D%22M175.803%2092.849c18.683%2013.344%2041.56%2021.195%2066.272%2021.195V76.631c-13.794-2.937-26.005-10.141-35.186-20.162c-15.715-9.802-27.038-25.972-30.358-44.898h-34.643v189.843c-.079%2022.132-18.049%2040.052-40.21%2040.052c-13.058%200-24.66-6.221-32.007-15.86c-13.12-6.618-22.118-20.206-22.118-35.898c0-22.193%2018-40.187%2040.208-40.187c4.255%200%208.356.662%2012.203%201.882v-37.822c-47.692.985-86.047%2039.933-86.047%2087.834c0%2023.912%209.551%2045.589%2025.053%2061.428c13.985%209.385%2030.82%2014.86%2048.934%2014.86c48.545%200%2087.9-39.335%2087.9-87.857z%22%2F%3E%3Cpath%20fill%3D%22%2300f2ea%22%20d%3D%22M242.075%2076.63V66.516a66.3%2066.3%200%200%201-35.186-10.047a66.47%2066.47%200%200%200%2035.186%2020.163M176.53%2011.57a68%2068%200%200%201-.728-5.457V0h-47.834v189.845c-.076%2022.13-18.046%2040.05-40.208%2040.05a40.06%2040.06%200%200%201-18.09-4.287c7.347%209.637%2018.949%2015.857%2032.007%2015.857c22.16%200%2040.132-17.918%2040.21-40.05V11.571zM99.966%20113.58v-10.769a89%2089%200%200%200-12.061-.818C39.355%20101.993%200%20141.327%200%20189.845c0%2030.419%2015.467%2057.227%2038.971%2072.996c-15.502-15.838-25.053-37.516-25.053-61.427c0-47.9%2038.354-86.848%2086.048-87.833%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%20290%22%3E%3Cpath%20fill%3D%22%23ff004f%22%20d%3D%22M189.72%20104.421c18.678%2013.345%2041.56%2021.197%2066.273%2021.197v-47.53a67%2067%200%200%201-13.918-1.456v37.413c-24.711%200-47.59-7.851-66.272-21.195v96.996c0%2048.523-39.356%2087.855-87.9%2087.855c-18.113%200-34.949-5.473-48.934-14.86c15.962%2016.313%2038.222%2026.432%2062.848%2026.432c48.548%200%2087.905-39.332%2087.905-87.857v-96.995zm17.17-47.952c-9.546-10.423-15.814-23.893-17.17-38.785v-6.113h-13.189c3.32%2018.927%2014.644%2035.097%2030.358%2044.898M69.673%20225.607a40%2040%200%200%201-8.203-24.33c0-22.192%2018.001-40.186%2040.21-40.186a40.3%2040.3%200%200%201%2012.197%201.883v-48.593c-4.61-.631-9.262-.9-13.912-.801v37.822a40.3%2040.3%200%200%200-12.203-1.882c-22.208%200-40.208%2017.992-40.208%2040.187c0%2015.694%208.997%2029.281%2022.119%2035.9%22%2F%3E%3Cpath%20d%3D%22M175.803%2092.849c18.683%2013.344%2041.56%2021.195%2066.272%2021.195V76.631c-13.794-2.937-26.005-10.141-35.186-20.162c-15.715-9.802-27.038-25.972-30.358-44.898h-34.643v189.843c-.079%2022.132-18.049%2040.052-40.21%2040.052c-13.058%200-24.66-6.221-32.007-15.86c-13.12-6.618-22.118-20.206-22.118-35.898c0-22.193%2018-40.187%2040.208-40.187c4.255%200%208.356.662%2012.203%201.882v-37.822c-47.692.985-86.047%2039.933-86.047%2087.834c0%2023.912%209.551%2045.589%2025.053%2061.428c13.985%209.385%2030.82%2014.86%2048.934%2014.86c48.545%200%2087.9-39.335%2087.9-87.857z%22%2F%3E%3Cpath%20fill%3D%22%2300f2ea%22%20d%3D%22M242.075%2076.63V66.516a66.3%2066.3%200%200%201-35.186-10.047a66.47%2066.47%200%200%200%2035.186%2020.163M176.53%2011.57a68%2068%200%200%201-.728-5.457V0h-47.834v189.845c-.076%2022.13-18.046%2040.05-40.208%2040.05a40.06%2040.06%200%200%201-18.09-4.287c7.347%209.637%2018.949%2015.857%2032.007%2015.857c22.16%200%2040.132-17.918%2040.21-40.05V11.571zM99.966%20113.58v-10.769a89%2089%200%200%200-12.061-.818C39.355%20101.993%200%20141.327%200%20189.845c0%2030.419%2015.467%2057.227%2038.971%2072.996c-15.502-15.838-25.053-37.516-25.053-61.427c0-47.9%2038.354-86.848%2086.048-87.833%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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