todoist icon logo

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

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

Use the todoist icon logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="#e44332" d="M224.002 0H31.998C14.358.04.061 14.337 0 32v192c0 17.6 14.397 32 31.998 32h192.004c17.6 0 31.998-14.4 31.998-32V32c0-17.6-14.397-32-31.998-32"/><path fill="#fff" d="M54.133 120.802c4.463-2.606 100.343-58.325 102.535-59.616c2.192-1.275 2.311-5.196-.16-6.615c-2.454-1.41-7.117-4.089-8.846-5.117a8.03 8.03 0 0 0-7.907.096c-1.227.717-83.151 48.299-85.885 49.86c-3.292 1.882-7.333 1.914-10.6 0L0 74.019v21.583c10.52 6.2 36.718 21.599 43.062 25.225c3.786 2.152 7.413 2.105 11.079-.024"/><path fill="#fff" d="M54.133 161.61c4.463-2.607 100.343-58.326 102.535-59.617c2.192-1.275 2.311-5.196-.16-6.615c-2.454-1.41-7.117-4.089-8.846-5.117a8.03 8.03 0 0 0-7.907.096c-1.227.717-83.151 48.298-85.885 49.86c-3.292 1.882-7.333 1.913-10.6 0L0 114.826v21.583c10.52 6.2 36.718 21.599 43.062 25.225c3.786 2.152 7.413 2.104 11.079-.024"/><path fill="#fff" d="M54.133 204.967c4.463-2.607 100.343-58.326 102.535-59.617c2.192-1.275 2.311-5.196-.16-6.615c-2.454-1.41-7.117-4.088-8.846-5.117a8.03 8.03 0 0 0-7.907.096c-1.227.717-83.151 48.299-85.885 49.86c-3.292 1.882-7.333 1.914-10.6 0L0 158.183v21.583c10.52 6.2 36.718 21.6 43.062 25.225c3.786 2.152 7.413 2.105 11.079-.023"/></svg>

React

import type { SVGProps } from "react";

export function LogosTodoistIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="#e44332" d="M224.002 0H31.998C14.358.04.061 14.337 0 32v192c0 17.6 14.397 32 31.998 32h192.004c17.6 0 31.998-14.4 31.998-32V32c0-17.6-14.397-32-31.998-32"/><path fill="#fff" d="M54.133 120.802c4.463-2.606 100.343-58.325 102.535-59.616c2.192-1.275 2.311-5.196-.16-6.615c-2.454-1.41-7.117-4.089-8.846-5.117a8.03 8.03 0 0 0-7.907.096c-1.227.717-83.151 48.299-85.885 49.86c-3.292 1.882-7.333 1.914-10.6 0L0 74.019v21.583c10.52 6.2 36.718 21.599 43.062 25.225c3.786 2.152 7.413 2.105 11.079-.024"/><path fill="#fff" d="M54.133 161.61c4.463-2.607 100.343-58.326 102.535-59.617c2.192-1.275 2.311-5.196-.16-6.615c-2.454-1.41-7.117-4.089-8.846-5.117a8.03 8.03 0 0 0-7.907.096c-1.227.717-83.151 48.298-85.885 49.86c-3.292 1.882-7.333 1.913-10.6 0L0 114.826v21.583c10.52 6.2 36.718 21.599 43.062 25.225c3.786 2.152 7.413 2.104 11.079-.024"/><path fill="#fff" d="M54.133 204.967c4.463-2.607 100.343-58.326 102.535-59.617c2.192-1.275 2.311-5.196-.16-6.615c-2.454-1.41-7.117-4.088-8.846-5.117a8.03 8.03 0 0 0-7.907.096c-1.227.717-83.151 48.299-85.885 49.86c-3.292 1.882-7.333 1.914-10.6 0L0 158.183v21.583c10.52 6.2 36.718 21.6 43.062 25.225c3.786 2.152 7.413 2.105 11.079-.023"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="#e44332" d="M224.002 0H31.998C14.358.04.061 14.337 0 32v192c0 17.6 14.397 32 31.998 32h192.004c17.6 0 31.998-14.4 31.998-32V32c0-17.6-14.397-32-31.998-32"/><path fill="#fff" d="M54.133 120.802c4.463-2.606 100.343-58.325 102.535-59.616c2.192-1.275 2.311-5.196-.16-6.615c-2.454-1.41-7.117-4.089-8.846-5.117a8.03 8.03 0 0 0-7.907.096c-1.227.717-83.151 48.299-85.885 49.86c-3.292 1.882-7.333 1.914-10.6 0L0 74.019v21.583c10.52 6.2 36.718 21.599 43.062 25.225c3.786 2.152 7.413 2.105 11.079-.024"/><path fill="#fff" d="M54.133 161.61c4.463-2.607 100.343-58.326 102.535-59.617c2.192-1.275 2.311-5.196-.16-6.615c-2.454-1.41-7.117-4.089-8.846-5.117a8.03 8.03 0 0 0-7.907.096c-1.227.717-83.151 48.298-85.885 49.86c-3.292 1.882-7.333 1.913-10.6 0L0 114.826v21.583c10.52 6.2 36.718 21.599 43.062 25.225c3.786 2.152 7.413 2.104 11.079-.024"/><path fill="#fff" d="M54.133 204.967c4.463-2.607 100.343-58.326 102.535-59.617c2.192-1.275 2.311-5.196-.16-6.615c-2.454-1.41-7.117-4.088-8.846-5.117a8.03 8.03 0 0 0-7.907.096c-1.227.717-83.151 48.299-85.885 49.86c-3.292 1.882-7.333 1.914-10.6 0L0 158.183v21.583c10.52 6.2 36.718 21.6 43.062 25.225c3.786 2.152 7.413 2.105 11.079-.023"/></svg>
</template>

CSS

.icon-todoist-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%20256%22%3E%3Cpath%20fill%3D%22%23e44332%22%20d%3D%22M224.002%200H31.998C14.358.04.061%2014.337%200%2032v192c0%2017.6%2014.397%2032%2031.998%2032h192.004c17.6%200%2031.998-14.4%2031.998-32V32c0-17.6-14.397-32-31.998-32%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M54.133%20120.802c4.463-2.606%20100.343-58.325%20102.535-59.616c2.192-1.275%202.311-5.196-.16-6.615c-2.454-1.41-7.117-4.089-8.846-5.117a8.03%208.03%200%200%200-7.907.096c-1.227.717-83.151%2048.299-85.885%2049.86c-3.292%201.882-7.333%201.914-10.6%200L0%2074.019v21.583c10.52%206.2%2036.718%2021.599%2043.062%2025.225c3.786%202.152%207.413%202.105%2011.079-.024%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M54.133%20161.61c4.463-2.607%20100.343-58.326%20102.535-59.617c2.192-1.275%202.311-5.196-.16-6.615c-2.454-1.41-7.117-4.089-8.846-5.117a8.03%208.03%200%200%200-7.907.096c-1.227.717-83.151%2048.298-85.885%2049.86c-3.292%201.882-7.333%201.913-10.6%200L0%20114.826v21.583c10.52%206.2%2036.718%2021.599%2043.062%2025.225c3.786%202.152%207.413%202.104%2011.079-.024%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M54.133%20204.967c4.463-2.607%20100.343-58.326%20102.535-59.617c2.192-1.275%202.311-5.196-.16-6.615c-2.454-1.41-7.117-4.088-8.846-5.117a8.03%208.03%200%200%200-7.907.096c-1.227.717-83.151%2048.299-85.885%2049.86c-3.292%201.882-7.333%201.914-10.6%200L0%20158.183v21.583c10.52%206.2%2036.718%2021.6%2043.062%2025.225c3.786%202.152%207.413%202.105%2011.079-.023%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%22%23e44332%22%20d%3D%22M224.002%200H31.998C14.358.04.061%2014.337%200%2032v192c0%2017.6%2014.397%2032%2031.998%2032h192.004c17.6%200%2031.998-14.4%2031.998-32V32c0-17.6-14.397-32-31.998-32%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M54.133%20120.802c4.463-2.606%20100.343-58.325%20102.535-59.616c2.192-1.275%202.311-5.196-.16-6.615c-2.454-1.41-7.117-4.089-8.846-5.117a8.03%208.03%200%200%200-7.907.096c-1.227.717-83.151%2048.299-85.885%2049.86c-3.292%201.882-7.333%201.914-10.6%200L0%2074.019v21.583c10.52%206.2%2036.718%2021.599%2043.062%2025.225c3.786%202.152%207.413%202.105%2011.079-.024%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M54.133%20161.61c4.463-2.607%20100.343-58.326%20102.535-59.617c2.192-1.275%202.311-5.196-.16-6.615c-2.454-1.41-7.117-4.089-8.846-5.117a8.03%208.03%200%200%200-7.907.096c-1.227.717-83.151%2048.298-85.885%2049.86c-3.292%201.882-7.333%201.913-10.6%200L0%20114.826v21.583c10.52%206.2%2036.718%2021.599%2043.062%2025.225c3.786%202.152%207.413%202.104%2011.079-.024%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M54.133%20204.967c4.463-2.607%20100.343-58.326%20102.535-59.617c2.192-1.275%202.311-5.196-.16-6.615c-2.454-1.41-7.117-4.088-8.846-5.117a8.03%208.03%200%200%200-7.907.096c-1.227.717-83.151%2048.299-85.885%2049.86c-3.292%201.882-7.333%201.914-10.6%200L0%20158.183v21.583c10.52%206.2%2036.718%2021.6%2043.062%2025.225c3.786%202.152%207.413%202.105%2011.079-.023%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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