Drupal icon

logos:drupal

The Drupal icon (logos:drupal) is a free SVG icon from the SVG Logos set by Gil Barbara. It is drawn on a 512 × 138 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 × 138

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="138" viewBox="0 0 512 138"><path fill="#009dde" d="M52.678 0c2.608 9.871 11.054 18.681 20.18 27.822l1.936 1.935c14.423 14.413 30.565 30.786 30.565 55.216A52.68 52.68 0 1 1 0 84.973c0-23.938 15.498-40.139 29.687-54.34l.876-.876l.436-.436C40.684 19.64 49.928 10.41 52.679 0m360.323 78.806c3.192 17.228-7.268 34.051-24.132 38.808c-15.916 3.876-23.087-8.484-24.39-11.73c-.136-.338-.26-.705-.815-.698c-.578.006-.642.602-.648.687v.01l-.005 8.63l-.005-.005v23.04h-17.245V84.98c.002-17.521 13.355-32.155 30.803-33.758c17.449-1.602 33.244 10.355 36.437 27.584m-360.324.208s-3.307 3.596-6.771 7.443l-.485.538c-2.503 2.785-5.01 5.62-6.343 7.25a18.88 18.88 0 0 0-4.516 11.966A18.12 18.12 0 0 0 52.68 124.33c10.006 0 18.118-8.111 18.118-18.118a17.72 17.72 0 0 0-4.545-12.005a5792 5792 0 0 1-6.152-6.878l-.482-.54zm404.442-27.79c17.273 1.586 30.532 15.944 30.797 33.232l.004.524v31.506h-17.245l-.009-10.602s-.026-.69-.648-.7c-.557-.005-.679.363-.815.7c-1.303 3.244-8.475 15.606-24.39 11.728c-16.863-4.757-27.323-21.58-24.13-38.808c3.194-17.227 18.989-29.184 36.436-27.58m-117.452 1.073l-.005 32.206c0 18.598-12.135 33.67-30.73 33.67c-18.415 0-30.316-14.772-30.552-33.113l-.004-.557l.005-32.175h17.167v32.175c0 9.411 4.073 17.025 13.489 17.025c9.298 0 13.348-7.432 13.444-16.686l.002-.34l-.028-32.205zM512 32.673v83.84h-17.128v-83.84zM264.38 51.597a27.5 27.5 0 0 1 6.59 2.413l.565.302v19.509l-.012-.012a6 6 0 0 0-.298-.266l-.138-.114c-1.109-.903-4.325-3.16-10.197-4.55c-14.63-3.459-22.25 9.816-22.4 12.83l-.003.088v34.66h-17.2V52.425h15.344l1.832 11.22s.061.583.602.594c.653.017.66-.208.85-.594c.388-.786 9.7-15.454 24.465-12.047M168.838 32.64c25.418 0 44.696 4.665 44.696 41.855c0 36.835-20.42 41.858-46.124 41.858h-19.564V32.639zm285.166 35.183a17.162 17.162 0 1 0 17.16 17.158c-.003-9.475-7.684-17.156-17.16-17.158m-74.326 0c-9.475.003-17.156 7.683-17.159 17.158a17.162 17.162 0 1 0 17.159-17.158M172.553 47.151h-7.388v54.676l7.102.182c14.565 0 23.945-1.324 23.945-27.515c0-24.862-8.116-27.297-23.66-27.343M52.678 30.308l-.006.006l-.148.148l-.546.545l-1.393 1.392l-1.407 1.407l-2.454 2.454l-1.314 1.314l-1.007 1.007l-.187.187l-.994.996l-.274.273l-.093.093c-2.015 2.006-6.075 5.755-1.186 11.037c2.54 2.745 10.048 10.642 17.855 18.965l1.042 1.112c9.214 9.835 18.553 19.97 20.386 22.682c1.575 2.331 1.802 3.423 3.934 3.346c1.195-.044 2.081-1.47 2.471-2.323c1.83-4 4.932-16.122-4.07-30.13c-6.21-9.667-18.423-22.424-25.399-29.405l-.593-.592a292 292 0 0 0-4.617-4.514M29.355 54.713C7.239 76.591 19.16 97.14 22.39 97.248c.334.012.892.052 1.274-1.013c1.85-5.161 16.735-20.088 20.227-23.67a1.25 1.25 0 0 0 .097-1.866Z"/></svg>

How to use the Drupal icon

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web component

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

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

HTML image

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

Related icons in SVG Logos

Drupal icon in other icon sets

Drupal icon FAQ

Is the Drupal 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 Drupal icon in React?

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

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

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

Browse all SVG Logos icons →