Obsidian icon

logos:obsidian

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

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="90" viewBox="0 0 512 90"><path fill="#8060d3" d="m25.894 56.42l1.514-.445c3.44-.98 7.89-1.977 12.879-1.354A18 18 0 0 1 50.72 59.3c3.598 2.878 6.477 7.196 9.355 14.392a25.2 25.2 0 0 0-2.878 9.715c-.72 4.318-4.678 7.556-8.996 6.117a85.6 85.6 0 0 0-26.626-5.037h-.72c6.477-10.075 7.197-19.79 5.038-28.066M10.782 37.35v-.36l1.022 1.18c2.548 2.98 6.13 7.546 8.333 13.213a31.3 31.3 0 0 1-2.878 31.304L1.787 66.855c-1.8-1.8-2.16-4.318-1.44-6.837L10.422 38.43zM45.684 6.766l12.233 15.472c1.08 1.08 1.08 2.16 1.08 3.598c.337 3.71.358 10.584 2.435 15.58l.443.972a64.8 64.8 0 0 0 7.197 12.593c.72 1.08.72 2.159.72 3.598l-7.197 10.795h-.36c-2.519-5.757-5.397-10.075-8.995-12.954c-4.318-3.598-8.636-5.037-12.594-5.757h-1.439c-3.238-6.836-3.238-12.233-3.238-16.91a39.6 39.6 0 0 1 4.318-13.674l2.878-5.757l2.519-5.397zM33.45 1.37c1.8-1.08 3.598-1.8 5.757-1.08c1.44 1.44 2.159 2.52 2.519 3.959v3.598a118 118 0 0 1-3.238 8.275l-1.44 2.52a35.98 35.98 0 0 0-1.799 31.663a43.2 43.2 0 0 0-10.074 2.158h-.36a52.5 52.5 0 0 0-13.313-19.79l1.439-10.794C13.3 20.44 14.02 19 15.1 18.28zm109.743 14.751c-21.589 0-37.06 13.313-37.06 32.024c0 18.35 15.471 32.023 37.06 32.023c21.229 0 36.7-13.673 36.7-32.383c0-17.99-15.471-31.664-36.7-31.664m0 12.594c12.593 0 21.948 7.556 21.948 19.43c0 11.514-9.355 19.43-21.948 19.43c-12.953 0-22.309-7.916-22.309-19.43c0-11.874 9.356-19.43 22.309-19.43m56.49 45.336c2.879 3.238 8.996 6.117 16.552 6.117c15.472 0 24.467-10.794 24.467-23.748c.36-13.313-8.995-24.107-24.467-24.107c-7.556 0-13.673 2.878-16.552 6.117V16.84h-14.032v62.247h14.032zm-.36-17.99c0-7.197 6.117-12.234 14.033-12.234c7.196 0 14.033 4.318 14.033 12.593c0 7.916-6.477 12.594-14.393 12.594c-7.556 0-13.673-5.038-13.673-12.234zm42.818 15.831a39.58 39.58 0 0 0 25.907 8.276c14.392 0 25.186-5.397 25.186-15.832c0-10.794-10.434-12.593-21.948-13.673c-10.075-1.439-12.953-1.439-12.953-3.958c0-2.518 3.238-3.598 8.995-3.598c7.196 0 13.313 1.8 17.27 5.757l7.197-8.275a34.9 34.9 0 0 0-23.747-8.276c-14.393 0-23.388 6.117-23.388 15.472c0 9.715 8.995 11.874 20.15 13.313c10.074 1.08 14.392 1.08 14.392 4.318c0 2.878-3.598 3.958-10.075 3.958c-7.916 0-14.752-2.52-20.51-7.197l-6.476 8.996zm55.77-43.177h14.393V17.56h-14.392zm14.034 5.037h-13.673v45.336h13.673zm47.135 40.3v5.036h14.033V17.201H359.08V38.79c-2.879-3.599-8.636-6.477-16.551-6.477c-15.472 0-24.468 10.794-24.468 23.748c0 12.953 8.996 23.747 24.468 23.747c7.915 0 13.672-2.878 16.55-6.117zm.36-17.991v.72c0 7.195-6.117 12.233-14.033 12.233c-7.196 0-14.033-4.678-14.033-12.594c0-8.275 6.477-12.593 14.393-12.593c7.556 0 13.673 5.037 13.673 12.234m21.948-27.346h14.393V17.56h-14.393zm14.033 5.037h-14.033v45.336h14.033zm25.187 46.416a28.8 28.8 0 0 0 18.71-6.117c2.159 4.318 7.916 7.196 17.99 5.037V69.014c-5.037 1.08-6.116 0-6.116-2.519V49.944c0-11.514-8.276-17.271-23.028-17.271c-12.594 0-22.309 5.397-25.187 13.673l12.234 3.598c1.439-3.598 6.116-6.477 12.593-6.477c7.196 0 10.075 2.879 10.075 6.117v.36l-17.99 1.799c-10.795 1.08-18.711 5.397-18.711 14.392c0 8.636 7.916 14.033 19.43 14.033m17.27-18.35c0 5.037-7.915 8.275-14.752 8.275c-5.397 0-8.635-1.799-8.635-4.677c0-2.879 2.519-3.958 7.196-4.678l16.192-1.44zm24.108 17.27h13.673V57.5c0-7.916 4.318-12.594 11.874-12.594c7.196 0 10.794 4.678 10.794 12.234v21.948H512V53.182c0-12.593-7.916-20.51-19.79-20.51c-7.196 0-12.953 2.88-16.551 6.477v-5.397h-13.673z"/></svg>

How to use the Obsidian icon

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web component

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

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

HTML image

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

Related icons in SVG Logos

Obsidian icon in other icon sets

Obsidian icon FAQ

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

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

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

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

Browse all SVG Logos icons →