database icon

database-filled from Reicon by REICON · Filled · UI · MIT Free for personal and commercial use.

Name
database-filled
Set
Reicon
Style
Filled
Category
UI
Viewbox
24×24
License
MIT

2 other variants in Reicon

The same icon in other sets

All database icons →

More ui icons from Reicon

Use the database icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M20 18c0 2.21-3.582 4-8 4s-8-1.79-8-4v-4.026c.502.617 1.215 1.129 2.008 1.525C7.58 16.285 9.7 16.75 12 16.75s4.42-.465 5.992-1.25c.793-.397 1.506-.91 2.008-1.526z"/><path d="M12 10.75c2.3 0 4.42-.465 5.992-1.25c.793-.397 1.506-.91 2.008-1.526V12c0 .5-1.786 1.591-2.679 2.158c-1.323.661-3.203 1.092-5.321 1.092s-3.998-.43-5.321-1.092C5.5 13.568 4 12.5 4 12V7.974c.502.617 1.215 1.129 2.008 1.525C7.58 10.285 9.7 10.75 12 10.75"/><path d="M17.321 8.158C15.998 8.819 14.118 9.25 12 9.25s-3.998-.43-5.321-1.092c-.515-.202-1.673-.843-2.477-1.879a.8.8 0 0 1-.162-.621c.023-.148.055-.301.096-.396C4.828 3.406 8.086 2 12 2s7.172 1.406 7.864 3.262c.041.095.073.248.096.396a.8.8 0 0 1-.162.621c-.804 1.036-1.962 1.677-2.477 1.879"/></g></svg>

React

import type { SVGProps } from "react";

export function ReiconDatabaseFilled(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M20 18c0 2.21-3.582 4-8 4s-8-1.79-8-4v-4.026c.502.617 1.215 1.129 2.008 1.525C7.58 16.285 9.7 16.75 12 16.75s4.42-.465 5.992-1.25c.793-.397 1.506-.91 2.008-1.526z"/><path d="M12 10.75c2.3 0 4.42-.465 5.992-1.25c.793-.397 1.506-.91 2.008-1.526V12c0 .5-1.786 1.591-2.679 2.158c-1.323.661-3.203 1.092-5.321 1.092s-3.998-.43-5.321-1.092C5.5 13.568 4 12.5 4 12V7.974c.502.617 1.215 1.129 2.008 1.525C7.58 10.285 9.7 10.75 12 10.75"/><path d="M17.321 8.158C15.998 8.819 14.118 9.25 12 9.25s-3.998-.43-5.321-1.092c-.515-.202-1.673-.843-2.477-1.879a.8.8 0 0 1-.162-.621c.023-.148.055-.301.096-.396C4.828 3.406 8.086 2 12 2s7.172 1.406 7.864 3.262c.041.095.073.248.096.396a.8.8 0 0 1-.162.621c-.804 1.036-1.962 1.677-2.477 1.879"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M20 18c0 2.21-3.582 4-8 4s-8-1.79-8-4v-4.026c.502.617 1.215 1.129 2.008 1.525C7.58 16.285 9.7 16.75 12 16.75s4.42-.465 5.992-1.25c.793-.397 1.506-.91 2.008-1.526z"/><path d="M12 10.75c2.3 0 4.42-.465 5.992-1.25c.793-.397 1.506-.91 2.008-1.526V12c0 .5-1.786 1.591-2.679 2.158c-1.323.661-3.203 1.092-5.321 1.092s-3.998-.43-5.321-1.092C5.5 13.568 4 12.5 4 12V7.974c.502.617 1.215 1.129 2.008 1.525C7.58 10.285 9.7 10.75 12 10.75"/><path d="M17.321 8.158C15.998 8.819 14.118 9.25 12 9.25s-3.998-.43-5.321-1.092c-.515-.202-1.673-.843-2.477-1.879a.8.8 0 0 1-.162-.621c.023-.148.055-.301.096-.396C4.828 3.406 8.086 2 12 2s7.172 1.406 7.864 3.262c.041.095.073.248.096.396a.8.8 0 0 1-.162.621c-.804 1.036-1.962 1.677-2.477 1.879"/></g></svg>
</template>

CSS

.icon-database-filled {
  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%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M20%2018c0%202.21-3.582%204-8%204s-8-1.79-8-4v-4.026c.502.617%201.215%201.129%202.008%201.525C7.58%2016.285%209.7%2016.75%2012%2016.75s4.42-.465%205.992-1.25c.793-.397%201.506-.91%202.008-1.526z%22%2F%3E%3Cpath%20d%3D%22M12%2010.75c2.3%200%204.42-.465%205.992-1.25c.793-.397%201.506-.91%202.008-1.526V12c0%20.5-1.786%201.591-2.679%202.158c-1.323.661-3.203%201.092-5.321%201.092s-3.998-.43-5.321-1.092C5.5%2013.568%204%2012.5%204%2012V7.974c.502.617%201.215%201.129%202.008%201.525C7.58%2010.285%209.7%2010.75%2012%2010.75%22%2F%3E%3Cpath%20d%3D%22M17.321%208.158C15.998%208.819%2014.118%209.25%2012%209.25s-3.998-.43-5.321-1.092c-.515-.202-1.673-.843-2.477-1.879a.8.8%200%200%201-.162-.621c.023-.148.055-.301.096-.396C4.828%203.406%208.086%202%2012%202s7.172%201.406%207.864%203.262c.041.095.073.248.096.396a.8.8%200%200%201-.162.621c-.804%201.036-1.962%201.677-2.477%201.879%22%2F%3E%3C%2Fg%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%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M20%2018c0%202.21-3.582%204-8%204s-8-1.79-8-4v-4.026c.502.617%201.215%201.129%202.008%201.525C7.58%2016.285%209.7%2016.75%2012%2016.75s4.42-.465%205.992-1.25c.793-.397%201.506-.91%202.008-1.526z%22%2F%3E%3Cpath%20d%3D%22M12%2010.75c2.3%200%204.42-.465%205.992-1.25c.793-.397%201.506-.91%202.008-1.526V12c0%20.5-1.786%201.591-2.679%202.158c-1.323.661-3.203%201.092-5.321%201.092s-3.998-.43-5.321-1.092C5.5%2013.568%204%2012.5%204%2012V7.974c.502.617%201.215%201.129%202.008%201.525C7.58%2010.285%209.7%2010.75%2012%2010.75%22%2F%3E%3Cpath%20d%3D%22M17.321%208.158C15.998%208.819%2014.118%209.25%2012%209.25s-3.998-.43-5.321-1.092c-.515-.202-1.673-.843-2.477-1.879a.8.8%200%200%201-.162-.621c.023-.148.055-.301.096-.396C4.828%203.406%208.086%202%2012%202s7.172%201.406%207.864%203.262c.041.095.073.248.096.396a.8.8%200%200%201-.162.621c-.804%201.036-1.962%201.677-2.477%201.879%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/reicon/database-filled.svg?color=%231a73e8&size=48