Atom icon

devicon:atom

The Atom icon (devicon:atom) is a free SVG icon from the Devicon set by konpa. It is drawn on a 128 × 128 grid. Devicon icons are released under the MIT 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: Devicon
Author: konpa
License: MIT
Size: 128 × 128

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" viewBox="0 0 128 128"><path fill="#67595d" fill-rule="evenodd" d="M38.622 66.979c-.806 1.674-1.508 3.089-2.175 4.522c-3.338 7.177-6.103 14.553-7.53 22.367c-.794 4.346-1.228 8.724-.093 13.087c.975 3.749 3.004 5.674 6.475 5.833c1.519.071 3.108-.251 4.587-.668c3.916-1.109 7.323-3.251 10.618-5.571c.8-.564 1.618-.916 2.616-.545c1.768.658 2.408 3.002.917 4.115c-5.381 4.009-11.076 7.466-18.049 7.68c-5.711.176-9.845-2.887-11.667-8.331c-1.36-4.062-1.44-8.24-.941-12.432c1.482-12.478 6.298-23.815 12.081-34.805c.497-.944.527-1.694.175-2.703c-1.444-4.147-2.787-8.33-4.106-12.519c-.25-.794-.506-1.02-1.368-.831c-5.666 1.246-11.248 2.767-16.274 5.744c-1.941 1.15-3.803 2.578-5.355 4.208c-2.581 2.71-2.63 5.709-.521 8.803c1.84 2.701 4.433 4.548 7.169 6.217c.856.524 1.759.97 2.621 1.484c1.253.749 1.682 2.201 1.039 3.409c-.645 1.209-2.092 1.688-3.406 1.012c-3.844-1.976-7.429-4.321-10.304-7.611c-1.762-2.016-3.053-4.282-3.48-6.968c-.532-3.35.428-6.302 2.44-8.954c2.075-2.733 4.8-4.683 7.775-6.303c5.276-2.873 10.961-4.589 16.801-5.854c.4-.087.796-.195 1.338-.33c-.275-1.558-.57-3.07-.806-4.593c-.957-6.194-1.398-12.393.123-18.567c.602-2.442 1.547-4.75 3.191-6.695c3.356-3.967 7.672-4.85 12.512-3.668c4.784 1.169 8.801 3.818 12.547 6.901c1.06.872 1.089 2.447.224 3.462c-.883 1.035-2.256 1.17-3.458.351c-1.888-1.285-3.724-2.658-5.686-3.819c-2.248-1.329-4.662-2.272-7.352-2.285c-2.222-.011-3.949.893-5.215 2.693c-1.604 2.283-2.177 4.917-2.48 7.618c-.641 5.713.12 11.329 1.233 16.918c.119.594.347.804.972.741c4.51-.45 9.021-.899 13.538-1.276c.982-.081 1.623-.436 2.232-1.206c5.87-7.415 12.305-14.281 19.875-20.01c4.217-3.191 8.673-5.973 13.8-7.492c3.212-.951 6.463-1.303 9.698-.166c4.04 1.42 6.298 4.49 7.462 8.452c1.234 4.206 1.041 8.494.54 12.781a47 47 0 0 1-.528 3.277c-.281 1.478-1.377 2.261-2.853 2.089c-1.342-.156-2.218-1.235-2.077-2.733c.195-2.066.666-4.121.687-6.183c.025-2.44-.027-4.943-.535-7.313c-1.059-4.928-4.468-6.861-9.511-5.749c-3.783.833-7.138 2.613-10.332 4.718c-6.561 4.324-12.162 9.731-17.362 15.577c-.967 1.087-1.897 2.208-2.837 3.318c-.057.066-.053.184-.125.465h1.361c13.391.135 26.585 1.727 39.479 5.438c6.14 1.768 12.067 4.072 17.521 7.465c2.902 1.805 5.566 3.894 7.673 6.62c4.297 5.56 3.936 11.802-1.007 16.781c-3.338 3.363-7.449 5.487-11.828 7.137c-1.239.465-2.603-.218-3.077-1.405c-.521-1.304.044-2.653 1.37-3.296c2.022-.98 4.125-1.829 6.037-2.993a21 21 0 0 0 4.347-3.499c2.677-2.849 2.776-5.963.506-9.151c-1.7-2.388-3.984-4.134-6.44-5.66c-6.06-3.766-12.71-6.099-19.557-7.92c-7.138-1.899-14.39-3.224-21.755-3.748c-5.869-.417-11.759-.537-17.639-.816c-.849-.041-1.429.21-1.901.938c-3.447 5.316-6.933 10.607-10.362 15.935c-.25.388-.356 1.086-.185 1.497c5.805 13.814 13.157 26.708 22.9 38.155c4.102 4.817 8.563 9.272 13.98 12.643c2.542 1.581 5.195 2.9 8.272 3.105c2.788.188 4.822-.979 6.206-3.345c1.304-2.229 1.827-4.695 2.061-7.229c.756-8.177-.861-16.064-3.005-23.87c-2.196-7.996-5.304-15.654-8.865-23.136c-.287-.602-.522-1.317-.491-1.965c.057-1.179.987-2.018 2.15-2.2c1.022-.16 2.098.402 2.609 1.498c1.274 2.728 2.567 5.451 3.734 8.226c3.602 8.571 6.502 17.365 8.034 26.563c1.069 6.42 1.58 12.863.096 19.294a22.2 22.2 0 0 1-1.439 4.21c-2.527 5.524-7.651 8.02-13.588 6.722c-4.827-1.057-8.901-3.579-12.702-6.592c-6.991-5.541-12.663-12.297-17.793-19.535c-5.848-8.245-10.787-17.013-14.925-26.234c-.155-.343-.333-.676-.637-1.295m-2.528-21.95l3.196 10.164c2.525-3.854 4.879-7.446 7.411-11.313zm28.374 26.238c-4.017-.005-7.286-3.261-7.278-7.249c.007-4.052 3.272-7.281 7.356-7.28c4.014.002 7.276 3.255 7.279 7.255c.002 4.047-3.267 7.279-7.357 7.274" clip-rule="evenodd"/></svg>

How to use the Atom icon

React

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

<Icon icon="devicon:atom" width="24" />

Vue

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

<template>
  <Icon icon="devicon:atom" width="24" />
</template>

Svelte

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

<Icon icon="devicon:atom" width="24" />

Tailwind CSS

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

UnoCSS

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

Web component

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

<iconify-icon icon="devicon:atom"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/devicon/atom.svg" alt="Atom icon" width="24" height="24">

Related icons in Devicon

Atom icon in other icon sets

Atom icon FAQ

Is the Atom icon free for commercial use?

Yes. Devicon icons are released under the MIT license, which allows use in personal and commercial projects.

How do I use the Atom icon in React?

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

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

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

Browse all Devicon icons →