tailwind icon

tailwind from Material Design Icons by Pictogrammers · Filled · Brand / Logo · Apache-2.0 Free for personal and commercial use.

Name: tailwind
Set: Material Design Icons
Style: Filled
Category: Brand / Logo
Viewbox: 24×24
License: Apache 2.0

The same icon in other sets

tailwindCatppuccin Icons tailwind-solidFlowbite Icons tailwind-outlineTeenyicons

More brand / logo icons from Material Design Icons

Use the tailwind icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 6c-2.67 0-4.33 1.33-5 4c1-1.33 2.17-1.83 3.5-1.5c.76.19 1.31.74 1.91 1.35c.98 1 2.09 2.15 4.59 2.15c2.67 0 4.33-1.33 5-4c-1 1.33-2.17 1.83-3.5 1.5c-.76-.19-1.3-.74-1.91-1.35C15.61 7.15 14.5 6 12 6m-5 6c-2.67 0-4.33 1.33-5 4c1-1.33 2.17-1.83 3.5-1.5c.76.19 1.3.74 1.91 1.35C8.39 16.85 9.5 18 12 18c2.67 0 4.33-1.33 5-4c-1 1.33-2.17 1.83-3.5 1.5c-.76-.19-1.3-.74-1.91-1.35C10.61 13.15 9.5 12 7 12"/></svg>

React

import type { SVGProps } from "react";

export function MdiTailwind(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="M12 6c-2.67 0-4.33 1.33-5 4c1-1.33 2.17-1.83 3.5-1.5c.76.19 1.31.74 1.91 1.35c.98 1 2.09 2.15 4.59 2.15c2.67 0 4.33-1.33 5-4c-1 1.33-2.17 1.83-3.5 1.5c-.76-.19-1.3-.74-1.91-1.35C15.61 7.15 14.5 6 12 6m-5 6c-2.67 0-4.33 1.33-5 4c1-1.33 2.17-1.83 3.5-1.5c.76.19 1.3.74 1.91 1.35C8.39 16.85 9.5 18 12 18c2.67 0 4.33-1.33 5-4c-1 1.33-2.17 1.83-3.5 1.5c-.76-.19-1.3-.74-1.91-1.35C10.61 13.15 9.5 12 7 12"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 6c-2.67 0-4.33 1.33-5 4c1-1.33 2.17-1.83 3.5-1.5c.76.19 1.31.74 1.91 1.35c.98 1 2.09 2.15 4.59 2.15c2.67 0 4.33-1.33 5-4c-1 1.33-2.17 1.83-3.5 1.5c-.76-.19-1.3-.74-1.91-1.35C15.61 7.15 14.5 6 12 6m-5 6c-2.67 0-4.33 1.33-5 4c1-1.33 2.17-1.83 3.5-1.5c.76.19 1.3.74 1.91 1.35C8.39 16.85 9.5 18 12 18c2.67 0 4.33-1.33 5-4c-1 1.33-2.17 1.83-3.5 1.5c-.76-.19-1.3-.74-1.91-1.35C10.61 13.15 9.5 12 7 12"/></svg>
</template>

CSS

.icon-tailwind {
  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%22M12%206c-2.67%200-4.33%201.33-5%204c1-1.33%202.17-1.83%203.5-1.5c.76.19%201.31.74%201.91%201.35c.98%201%202.09%202.15%204.59%202.15c2.67%200%204.33-1.33%205-4c-1%201.33-2.17%201.83-3.5%201.5c-.76-.19-1.3-.74-1.91-1.35C15.61%207.15%2014.5%206%2012%206m-5%206c-2.67%200-4.33%201.33-5%204c1-1.33%202.17-1.83%203.5-1.5c.76.19%201.3.74%201.91%201.35C8.39%2016.85%209.5%2018%2012%2018c2.67%200%204.33-1.33%205-4c-1%201.33-2.17%201.83-3.5%201.5c-.76-.19-1.3-.74-1.91-1.35C10.61%2013.15%209.5%2012%207%2012%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%22M12%206c-2.67%200-4.33%201.33-5%204c1-1.33%202.17-1.83%203.5-1.5c.76.19%201.31.74%201.91%201.35c.98%201%202.09%202.15%204.59%202.15c2.67%200%204.33-1.33%205-4c-1%201.33-2.17%201.83-3.5%201.5c-.76-.19-1.3-.74-1.91-1.35C15.61%207.15%2014.5%206%2012%206m-5%206c-2.67%200-4.33%201.33-5%204c1-1.33%202.17-1.83%203.5-1.5c.76.19%201.3.74%201.91%201.35C8.39%2016.85%209.5%2018%2012%2018c2.67%200%204.33-1.33%205-4c-1%201.33-2.17%201.83-3.5%201.5c-.76-.19-1.3-.74-1.91-1.35C10.61%2013.15%209.5%2012%207%2012%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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