cpu icon

cpu from TDesign Icons by TDesign · Outline · MIT Free for personal and commercial use.

Name: cpu
Set: TDesign Icons
Style: Outline
Viewbox: 24×24
License: MIT

1 other variant in TDesign Icons

The same icon in other sets

cpuBootstrap Icons cpuElement Plus cpuFeather Icons cpuHuge Icons cpuHumbleicons cpuIconPark cpuIconPark Outline cpuIconPark Solid cpuIconPark TwoTone cpuIconoir cpuLucide cpuMajesticons cpu-16Octicons cpuPhosphor cpuPixelarticons cpu-fillRemix Icon cpu-boldSolar cpuTabler Icons

Use the cpu icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M4 4h16v16H4z"/><path d="M9 9h6v6H9z"/><path stroke="currentColor" stroke-linecap="square" stroke-width="2" d="M4 8H1.5M8 4V1.5M16 4V1.5M20 16h2.5M20 8h2.5M8 20v2.5m8-2.5v2.5M4 16H1.5M4 4h16v16H4z"/><path stroke="currentColor" stroke-linecap="square" stroke-width="2" d="M9 9h6v6H9z"/></g></svg>

React

import type { SVGProps } from "react";

export function TdesignCpu(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M4 4h16v16H4z"/><path d="M9 9h6v6H9z"/><path stroke="currentColor" strokeLinecap="square" strokeWidth="2" d="M4 8H1.5M8 4V1.5M16 4V1.5M20 16h2.5M20 8h2.5M8 20v2.5m8-2.5v2.5M4 16H1.5M4 4h16v16H4z"/><path stroke="currentColor" strokeLinecap="square" strokeWidth="2" d="M9 9h6v6H9z"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M4 4h16v16H4z"/><path d="M9 9h6v6H9z"/><path stroke="currentColor" stroke-linecap="square" stroke-width="2" d="M4 8H1.5M8 4V1.5M16 4V1.5M20 16h2.5M20 8h2.5M8 20v2.5m8-2.5v2.5M4 16H1.5M4 4h16v16H4z"/><path stroke="currentColor" stroke-linecap="square" stroke-width="2" d="M9 9h6v6H9z"/></g></svg>
</template>

CSS

.icon-cpu {
  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%22none%22%3E%3Cpath%20d%3D%22M4%204h16v16H4z%22%2F%3E%3Cpath%20d%3D%22M9%209h6v6H9z%22%2F%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22square%22%20stroke-width%3D%222%22%20d%3D%22M4%208H1.5M8%204V1.5M16%204V1.5M20%2016h2.5M20%208h2.5M8%2020v2.5m8-2.5v2.5M4%2016H1.5M4%204h16v16H4z%22%2F%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22square%22%20stroke-width%3D%222%22%20d%3D%22M9%209h6v6H9z%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%22none%22%3E%3Cpath%20d%3D%22M4%204h16v16H4z%22%2F%3E%3Cpath%20d%3D%22M9%209h6v6H9z%22%2F%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22square%22%20stroke-width%3D%222%22%20d%3D%22M4%208H1.5M8%204V1.5M16%204V1.5M20%2016h2.5M20%208h2.5M8%2020v2.5m8-2.5v2.5M4%2016H1.5M4%204h16v16H4z%22%2F%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22square%22%20stroke-width%3D%222%22%20d%3D%22M9%209h6v6H9z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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