aistudio logo

aistudio from LobeHub AI Icons by LobeHub · Mono · MIT Free for personal and commercial use.

Name
aistudio
Set
LobeHub AI Icons
Style
Mono
Viewbox
24×24
License
MIT

1 other variant in LobeHub AI Icons

aistudio-text

Use the aistudio logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor" fill-rule="evenodd"><path d="M9.921 4.196H6.328A2.705 2.705 0 003.623 6.9v11.362a2.705 2.705 0 002.705 2.705h11.363a2.705 2.705 0 002.705-2.705v-4.756l1.623-1.113v5.87a4.329 4.329 0 01-4.328 4.328H6.328A4.329 4.329 0 012 18.263V6.901a4.328 4.328 0 014.328-4.329h4.545l-.952 1.624z"/><path d="M17.82 0c.145 0 .268.104.299.246a7 7 0 001.9 3.484 7 7 0 003.485 1.901c.142.031.246.154.246.3a.308.308 0 01-.246.298A7 7 0 0020.02 8.13a7 7 0 00-1.912 3.535.297.297 0 01-.288.238.297.297 0 01-.288-.238A7 7 0 0015.62 8.13a7 7 0 00-3.535-1.912.297.297 0 01-.238-.288c0-.14.1-.26.238-.288A7 7 0 0015.62 3.73 7.001 7.001 0 0017.521.246.308.308 0 0117.82 0z"/></g></svg>

React

import type { SVGProps } from "react";

export function LobehubAistudio(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" fillRule="evenodd"><path d="M9.921 4.196H6.328A2.705 2.705 0 003.623 6.9v11.362a2.705 2.705 0 002.705 2.705h11.363a2.705 2.705 0 002.705-2.705v-4.756l1.623-1.113v5.87a4.329 4.329 0 01-4.328 4.328H6.328A4.329 4.329 0 012 18.263V6.901a4.328 4.328 0 014.328-4.329h4.545l-.952 1.624z"/><path d="M17.82 0c.145 0 .268.104.299.246a7 7 0 001.9 3.484 7 7 0 003.485 1.901c.142.031.246.154.246.3a.308.308 0 01-.246.298A7 7 0 0020.02 8.13a7 7 0 00-1.912 3.535.297.297 0 01-.288.238.297.297 0 01-.288-.238A7 7 0 0015.62 8.13a7 7 0 00-3.535-1.912.297.297 0 01-.238-.288c0-.14.1-.26.238-.288A7 7 0 0015.62 3.73 7.001 7.001 0 0017.521.246.308.308 0 0117.82 0z"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor" fill-rule="evenodd"><path d="M9.921 4.196H6.328A2.705 2.705 0 003.623 6.9v11.362a2.705 2.705 0 002.705 2.705h11.363a2.705 2.705 0 002.705-2.705v-4.756l1.623-1.113v5.87a4.329 4.329 0 01-4.328 4.328H6.328A4.329 4.329 0 012 18.263V6.901a4.328 4.328 0 014.328-4.329h4.545l-.952 1.624z"/><path d="M17.82 0c.145 0 .268.104.299.246a7 7 0 001.9 3.484 7 7 0 003.485 1.901c.142.031.246.154.246.3a.308.308 0 01-.246.298A7 7 0 0020.02 8.13a7 7 0 00-1.912 3.535.297.297 0 01-.288.238.297.297 0 01-.288-.238A7 7 0 0015.62 8.13a7 7 0 00-3.535-1.912.297.297 0 01-.238-.288c0-.14.1-.26.238-.288A7 7 0 0015.62 3.73 7.001 7.001 0 0017.521.246.308.308 0 0117.82 0z"/></g></svg>
</template>

CSS

.icon-aistudio {
  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%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M9.921%204.196H6.328A2.705%202.705%200%20003.623%206.9v11.362a2.705%202.705%200%20002.705%202.705h11.363a2.705%202.705%200%20002.705-2.705v-4.756l1.623-1.113v5.87a4.329%204.329%200%2001-4.328%204.328H6.328A4.329%204.329%200%20012%2018.263V6.901a4.328%204.328%200%20014.328-4.329h4.545l-.952%201.624z%22%2F%3E%3Cpath%20d%3D%22M17.82%200c.145%200%20.268.104.299.246a7%207%200%20001.9%203.484%207%207%200%20003.485%201.901c.142.031.246.154.246.3a.308.308%200%2001-.246.298A7%207%200%200020.02%208.13a7%207%200%2000-1.912%203.535.297.297%200%2001-.288.238.297.297%200%2001-.288-.238A7%207%200%200015.62%208.13a7%207%200%2000-3.535-1.912.297.297%200%2001-.238-.288c0-.14.1-.26.238-.288A7%207%200%200015.62%203.73%207.001%207.001%200%200017.521.246.308.308%200%200117.82%200z%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%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M9.921%204.196H6.328A2.705%202.705%200%20003.623%206.9v11.362a2.705%202.705%200%20002.705%202.705h11.363a2.705%202.705%200%20002.705-2.705v-4.756l1.623-1.113v5.87a4.329%204.329%200%2001-4.328%204.328H6.328A4.329%204.329%200%20012%2018.263V6.901a4.328%204.328%200%20014.328-4.329h4.545l-.952%201.624z%22%2F%3E%3Cpath%20d%3D%22M17.82%200c.145%200%20.268.104.299.246a7%207%200%20001.9%203.484%207%207%200%20003.485%201.901c.142.031.246.154.246.3a.308.308%200%2001-.246.298A7%207%200%200020.02%208.13a7%207%200%2000-1.912%203.535.297.297%200%2001-.288.238.297.297%200%2001-.288-.238A7%207%200%200015.62%208.13a7%207%200%2000-3.535-1.912.297.297%200%2001-.238-.288c0-.14.1-.26.238-.288A7%207%200%200015.62%203.73%207.001%207.001%200%200017.521.246.308.308%200%200117.82%200z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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

Aistudio logo — LobeHub AI Icons · IconsDB