Drift icon

logos:drift

The Drift icon (logos:drift) is a free SVG icon from the SVG Logos set by Gil Barbara. It is drawn on a 512 × 117 grid. SVG Logos icons are released under the CC0 license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set: SVG Logos
Author: Gil Barbara
License: CC0-1.0
Size: 512 × 117

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="117" viewBox="0 0 512 117"><path fill="#111" d="M310.39.518c1.743.29 2.322 2.032 1.453 3.191c-.096.097-.16.193-.214.29l-.15.29a1.3 1.3 0 0 1-.215.289L282.25 37.356l-.864.873c-1.168 1.449 0 3.191 2.028 3.481h11.6c2.032.29 2.9 2.032 2.032 3.48l-.869.87L275 70.138l-.87.87c-.868 1.452.29 3.19 2.033 3.19h7.83a3.05 3.05 0 0 1 2.612 1.453c.29.864.29 1.738-.58 2.317l-.584.585l-49.311 37.127l-.87.874c-.584.29-1.163.29-1.452 0a2.2 2.2 0 0 1-.58-1.164c0-.29.29-.869.29-.869l13.632-27.844l.29-.874c.874-1.743 0-3.48-2.032-3.77h-11.595c-1.738-.29-2.612-1.743-2.033-2.901c.295-.29.585-.874.585-.874l16.818-28.134s.294-.295.294-.584c.87-1.738-.29-3.191-2.322-3.191h-11.02a2.54 2.54 0 0 1-2.612-2.032c0-.575 0-1.159.58-1.738l5.223-8.994L256.44 3.71l.29-.58c.873-1.452 2.321-2.321 4.354-2.321l47.863-.29zm-126.477 0c26.4 0 40.323 17.987 40.323 39.45c0 19.729-11.315 30.46-20.304 34.81l20.304 40.612h-38.58v.295l-15.086-35.11h-12.763v35.1h-33.942V.518zM405.248.513v30.456h-51.344v15.375h50.185v30.46h-50.185v38.87l-34.231.01V.514zM512 .518v30.456h-30.456v84.71h-33.941V30.97h-30.171V.519zM50.475.513c35.679 0 62.08 20.593 62.08 57.436c0 36.837-26.401 57.726-61.785 57.726H0V.513zm.29 30.46H34.23v54.25h16.244c17.113 0 27.27-12.763 27.27-27.269h-.005c0-15.665-8.699-26.98-26.975-26.98m127.93 0h-20.599V53.89h20.599c5.797 0 11.026-3.475 11.026-11.6c0-7.83-5.518-11.315-11.026-11.315"/></svg>

How to use the Drift icon

React

import { Icon } from "@iconify/react";

<Icon icon="logos:drift" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="logos:drift" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="logos:drift" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[logos--drift]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/logos -->
<div class="i-logos:drift"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="logos:drift"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/logos/drift.svg" alt="Drift icon" width="24" height="24">

Drift icon FAQ

Is the Drift icon free for commercial use?

Yes. SVG Logos icons are released under the CC0 license, which allows use in personal and commercial projects.

How do I use the Drift icon in React?

Install @iconify/react and render <Icon icon="logos:drift" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Drift icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/logos/drift.svg" alt="Drift icon">, or paste the SVG code inline to style it with CSS.

Browse all SVG Logos icons →