atom icon
atom from BoxIcons v2 by Boxicons · Regular · MIT Free for personal and commercial use.
- Name
- atom
- Set
- BoxIcons v2
- Style
- Regular
- Viewbox
- 24×24
- License
- MIT
- Aliases
- bx-atom
The same icon in other sets
Use the atom icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3.102 20.898c.698.699 1.696 1.068 2.887 1.068c1.742 0 3.855-.778 6.012-2.127c2.156 1.35 4.27 2.127 6.012 2.127c1.19 0 2.188-.369 2.887-1.068c1.269-1.269 1.411-3.413.401-6.039c-.358-.932-.854-1.895-1.457-2.859a17 17 0 0 0 1.457-2.859c1.01-2.626.867-4.771-.401-6.039c-.698-.699-1.696-1.068-2.887-1.068c-1.742 0-3.855.778-6.012 2.127c-2.156-1.35-4.27-2.127-6.012-2.127c-1.19 0-2.188.369-2.887 1.068C1.833 4.371 1.69 6.515 2.7 9.141c.359.932.854 1.895 1.457 2.859A17 17 0 0 0 2.7 14.859c-1.01 2.626-.867 4.77.402 6.039m16.331-5.321c.689 1.79.708 3.251.052 3.907c-.32.32-.815.482-1.473.482c-1.167 0-2.646-.503-4.208-1.38a26.6 26.6 0 0 0 4.783-4.784c.336.601.623 1.196.846 1.775M12 17.417a23.6 23.6 0 0 1-2.934-2.483A24 24 0 0 1 6.566 12A23.7 23.7 0 0 1 12 6.583a23.6 23.6 0 0 1 2.934 2.483a24 24 0 0 1 2.5 2.934A23.7 23.7 0 0 1 12 17.417m6.012-13.383c.657 0 1.152.162 1.473.482c.656.656.638 2.117-.052 3.907c-.223.579-.51 1.174-.846 1.775a26.5 26.5 0 0 0-4.783-4.784c1.562-.876 3.041-1.38 4.208-1.38M4.567 8.423c-.689-1.79-.708-3.251-.052-3.907c.32-.32.815-.482 1.473-.482c1.167 0 2.646.503 4.208 1.38a26.5 26.5 0 0 0-4.783 4.784a14 14 0 0 1-.846-1.775m0 7.154c.223-.579.51-1.174.846-1.775a26.5 26.5 0 0 0 4.783 4.784c-1.563.877-3.041 1.38-4.208 1.38c-.657 0-1.152-.162-1.473-.482c-.656-.656-.637-2.117.052-3.907"/><circle cx="12" cy="12" r="2.574" fill="currentColor"/></svg>
React
import type { SVGProps } from "react";
export function BxAtom(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="M3.102 20.898c.698.699 1.696 1.068 2.887 1.068c1.742 0 3.855-.778 6.012-2.127c2.156 1.35 4.27 2.127 6.012 2.127c1.19 0 2.188-.369 2.887-1.068c1.269-1.269 1.411-3.413.401-6.039c-.358-.932-.854-1.895-1.457-2.859a17 17 0 0 0 1.457-2.859c1.01-2.626.867-4.771-.401-6.039c-.698-.699-1.696-1.068-2.887-1.068c-1.742 0-3.855.778-6.012 2.127c-2.156-1.35-4.27-2.127-6.012-2.127c-1.19 0-2.188.369-2.887 1.068C1.833 4.371 1.69 6.515 2.7 9.141c.359.932.854 1.895 1.457 2.859A17 17 0 0 0 2.7 14.859c-1.01 2.626-.867 4.77.402 6.039m16.331-5.321c.689 1.79.708 3.251.052 3.907c-.32.32-.815.482-1.473.482c-1.167 0-2.646-.503-4.208-1.38a26.6 26.6 0 0 0 4.783-4.784c.336.601.623 1.196.846 1.775M12 17.417a23.6 23.6 0 0 1-2.934-2.483A24 24 0 0 1 6.566 12A23.7 23.7 0 0 1 12 6.583a23.6 23.6 0 0 1 2.934 2.483a24 24 0 0 1 2.5 2.934A23.7 23.7 0 0 1 12 17.417m6.012-13.383c.657 0 1.152.162 1.473.482c.656.656.638 2.117-.052 3.907c-.223.579-.51 1.174-.846 1.775a26.5 26.5 0 0 0-4.783-4.784c1.562-.876 3.041-1.38 4.208-1.38M4.567 8.423c-.689-1.79-.708-3.251-.052-3.907c.32-.32.815-.482 1.473-.482c1.167 0 2.646.503 4.208 1.38a26.5 26.5 0 0 0-4.783 4.784a14 14 0 0 1-.846-1.775m0 7.154c.223-.579.51-1.174.846-1.775a26.5 26.5 0 0 0 4.783 4.784c-1.563.877-3.041 1.38-4.208 1.38c-.657 0-1.152-.162-1.473-.482c-.656-.656-.637-2.117.052-3.907"/><circle cx="12" cy="12" r="2.574" fill="currentColor"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3.102 20.898c.698.699 1.696 1.068 2.887 1.068c1.742 0 3.855-.778 6.012-2.127c2.156 1.35 4.27 2.127 6.012 2.127c1.19 0 2.188-.369 2.887-1.068c1.269-1.269 1.411-3.413.401-6.039c-.358-.932-.854-1.895-1.457-2.859a17 17 0 0 0 1.457-2.859c1.01-2.626.867-4.771-.401-6.039c-.698-.699-1.696-1.068-2.887-1.068c-1.742 0-3.855.778-6.012 2.127c-2.156-1.35-4.27-2.127-6.012-2.127c-1.19 0-2.188.369-2.887 1.068C1.833 4.371 1.69 6.515 2.7 9.141c.359.932.854 1.895 1.457 2.859A17 17 0 0 0 2.7 14.859c-1.01 2.626-.867 4.77.402 6.039m16.331-5.321c.689 1.79.708 3.251.052 3.907c-.32.32-.815.482-1.473.482c-1.167 0-2.646-.503-4.208-1.38a26.6 26.6 0 0 0 4.783-4.784c.336.601.623 1.196.846 1.775M12 17.417a23.6 23.6 0 0 1-2.934-2.483A24 24 0 0 1 6.566 12A23.7 23.7 0 0 1 12 6.583a23.6 23.6 0 0 1 2.934 2.483a24 24 0 0 1 2.5 2.934A23.7 23.7 0 0 1 12 17.417m6.012-13.383c.657 0 1.152.162 1.473.482c.656.656.638 2.117-.052 3.907c-.223.579-.51 1.174-.846 1.775a26.5 26.5 0 0 0-4.783-4.784c1.562-.876 3.041-1.38 4.208-1.38M4.567 8.423c-.689-1.79-.708-3.251-.052-3.907c.32-.32.815-.482 1.473-.482c1.167 0 2.646.503 4.208 1.38a26.5 26.5 0 0 0-4.783 4.784a14 14 0 0 1-.846-1.775m0 7.154c.223-.579.51-1.174.846-1.775a26.5 26.5 0 0 0 4.783 4.784c-1.563.877-3.041 1.38-4.208 1.38c-.657 0-1.152-.162-1.473-.482c-.656-.656-.637-2.117.052-3.907"/><circle cx="12" cy="12" r="2.574" fill="currentColor"/></svg> </template>
CSS
.icon-atom {
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%22M3.102%2020.898c.698.699%201.696%201.068%202.887%201.068c1.742%200%203.855-.778%206.012-2.127c2.156%201.35%204.27%202.127%206.012%202.127c1.19%200%202.188-.369%202.887-1.068c1.269-1.269%201.411-3.413.401-6.039c-.358-.932-.854-1.895-1.457-2.859a17%2017%200%200%200%201.457-2.859c1.01-2.626.867-4.771-.401-6.039c-.698-.699-1.696-1.068-2.887-1.068c-1.742%200-3.855.778-6.012%202.127c-2.156-1.35-4.27-2.127-6.012-2.127c-1.19%200-2.188.369-2.887%201.068C1.833%204.371%201.69%206.515%202.7%209.141c.359.932.854%201.895%201.457%202.859A17%2017%200%200%200%202.7%2014.859c-1.01%202.626-.867%204.77.402%206.039m16.331-5.321c.689%201.79.708%203.251.052%203.907c-.32.32-.815.482-1.473.482c-1.167%200-2.646-.503-4.208-1.38a26.6%2026.6%200%200%200%204.783-4.784c.336.601.623%201.196.846%201.775M12%2017.417a23.6%2023.6%200%200%201-2.934-2.483A24%2024%200%200%201%206.566%2012A23.7%2023.7%200%200%201%2012%206.583a23.6%2023.6%200%200%201%202.934%202.483a24%2024%200%200%201%202.5%202.934A23.7%2023.7%200%200%201%2012%2017.417m6.012-13.383c.657%200%201.152.162%201.473.482c.656.656.638%202.117-.052%203.907c-.223.579-.51%201.174-.846%201.775a26.5%2026.5%200%200%200-4.783-4.784c1.562-.876%203.041-1.38%204.208-1.38M4.567%208.423c-.689-1.79-.708-3.251-.052-3.907c.32-.32.815-.482%201.473-.482c1.167%200%202.646.503%204.208%201.38a26.5%2026.5%200%200%200-4.783%204.784a14%2014%200%200%201-.846-1.775m0%207.154c.223-.579.51-1.174.846-1.775a26.5%2026.5%200%200%200%204.783%204.784c-1.563.877-3.041%201.38-4.208%201.38c-.657%200-1.152-.162-1.473-.482c-.656-.656-.637-2.117.052-3.907%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222.574%22%20fill%3D%22currentColor%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%22M3.102%2020.898c.698.699%201.696%201.068%202.887%201.068c1.742%200%203.855-.778%206.012-2.127c2.156%201.35%204.27%202.127%206.012%202.127c1.19%200%202.188-.369%202.887-1.068c1.269-1.269%201.411-3.413.401-6.039c-.358-.932-.854-1.895-1.457-2.859a17%2017%200%200%200%201.457-2.859c1.01-2.626.867-4.771-.401-6.039c-.698-.699-1.696-1.068-2.887-1.068c-1.742%200-3.855.778-6.012%202.127c-2.156-1.35-4.27-2.127-6.012-2.127c-1.19%200-2.188.369-2.887%201.068C1.833%204.371%201.69%206.515%202.7%209.141c.359.932.854%201.895%201.457%202.859A17%2017%200%200%200%202.7%2014.859c-1.01%202.626-.867%204.77.402%206.039m16.331-5.321c.689%201.79.708%203.251.052%203.907c-.32.32-.815.482-1.473.482c-1.167%200-2.646-.503-4.208-1.38a26.6%2026.6%200%200%200%204.783-4.784c.336.601.623%201.196.846%201.775M12%2017.417a23.6%2023.6%200%200%201-2.934-2.483A24%2024%200%200%201%206.566%2012A23.7%2023.7%200%200%201%2012%206.583a23.6%2023.6%200%200%201%202.934%202.483a24%2024%200%200%201%202.5%202.934A23.7%2023.7%200%200%201%2012%2017.417m6.012-13.383c.657%200%201.152.162%201.473.482c.656.656.638%202.117-.052%203.907c-.223.579-.51%201.174-.846%201.775a26.5%2026.5%200%200%200-4.783-4.784c1.562-.876%203.041-1.38%204.208-1.38M4.567%208.423c-.689-1.79-.708-3.251-.052-3.907c.32-.32.815-.482%201.473-.482c1.167%200%202.646.503%204.208%201.38a26.5%2026.5%200%200%200-4.783%204.784a14%2014%200%200%201-.846-1.775m0%207.154c.223-.579.51-1.174.846-1.775a26.5%2026.5%200%200%200%204.783%204.784c-1.563.877-3.041%201.38-4.208%201.38c-.657%200-1.152-.162-1.473-.482c-.656-.656-.637-2.117.052-3.907%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222.574%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/bx/atom.svg?color=%231a73e8&size=48
