developer tools icon

developer-tools from Codicons by Microsoft Corporation · Regular · CC-BY-4.0 Attribution required.

Name
developer-tools
Set
Codicons
Style
Regular
Viewbox
16×16
License
CC BY 4.0

Use the developer tools icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M1 3.5A2.5 2.5 0 0 1 3.5 1h7A2.5 2.5 0 0 1 13 3.5v1.53c-.33-.04-.67-.04-1 0V5H2v5.5c0 .83.67 1.5 1.5 1.5h2.95l-.72.72c-.09.09-.17.18-.24.28H3.5A2.5 2.5 0 0 1 1 10.5zm7.93 3.22l-.58-.58c-.2-.2-.51-.2-.71 0s-.2.51 0 .71l.74.74q.21-.465.54-.87zM2 4h10v-.5c0-.83-.67-1.5-1.5-1.5h-7C2.67 2 2 2.67 2 3.5zm4.35 2.85c.2-.2.2-.51 0-.71s-.51-.2-.71 0l-2 2c-.2.2-.2.51 0 .71l2 2c.2.2.51.2.71 0s.2-.51 0-.71L4.7 8.49l1.65-1.65zm6.54-.83c.37.04.47.48.21.74l-.98.98c-.59.59-.59 1.54 0 2.13s1.54.59 2.13 0l.98-.98c.26-.26.7-.16.74.21a3.525 3.525 0 0 1-4.68 3.73l-2.73 2.73c-.59.59-1.54.59-2.13 0s-.59-1.54 0-2.13l2.73-2.73c-.44-1.24-.17-2.68.83-3.67c.79-.79 1.87-1.13 2.9-1.01"/></svg>

React

import type { SVGProps } from "react";

export function CodiconDeveloperTools(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M1 3.5A2.5 2.5 0 0 1 3.5 1h7A2.5 2.5 0 0 1 13 3.5v1.53c-.33-.04-.67-.04-1 0V5H2v5.5c0 .83.67 1.5 1.5 1.5h2.95l-.72.72c-.09.09-.17.18-.24.28H3.5A2.5 2.5 0 0 1 1 10.5zm7.93 3.22l-.58-.58c-.2-.2-.51-.2-.71 0s-.2.51 0 .71l.74.74q.21-.465.54-.87zM2 4h10v-.5c0-.83-.67-1.5-1.5-1.5h-7C2.67 2 2 2.67 2 3.5zm4.35 2.85c.2-.2.2-.51 0-.71s-.51-.2-.71 0l-2 2c-.2.2-.2.51 0 .71l2 2c.2.2.51.2.71 0s.2-.51 0-.71L4.7 8.49l1.65-1.65zm6.54-.83c.37.04.47.48.21.74l-.98.98c-.59.59-.59 1.54 0 2.13s1.54.59 2.13 0l.98-.98c.26-.26.7-.16.74.21a3.525 3.525 0 0 1-4.68 3.73l-2.73 2.73c-.59.59-1.54.59-2.13 0s-.59-1.54 0-2.13l2.73-2.73c-.44-1.24-.17-2.68.83-3.67c.79-.79 1.87-1.13 2.9-1.01"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M1 3.5A2.5 2.5 0 0 1 3.5 1h7A2.5 2.5 0 0 1 13 3.5v1.53c-.33-.04-.67-.04-1 0V5H2v5.5c0 .83.67 1.5 1.5 1.5h2.95l-.72.72c-.09.09-.17.18-.24.28H3.5A2.5 2.5 0 0 1 1 10.5zm7.93 3.22l-.58-.58c-.2-.2-.51-.2-.71 0s-.2.51 0 .71l.74.74q.21-.465.54-.87zM2 4h10v-.5c0-.83-.67-1.5-1.5-1.5h-7C2.67 2 2 2.67 2 3.5zm4.35 2.85c.2-.2.2-.51 0-.71s-.51-.2-.71 0l-2 2c-.2.2-.2.51 0 .71l2 2c.2.2.51.2.71 0s.2-.51 0-.71L4.7 8.49l1.65-1.65zm6.54-.83c.37.04.47.48.21.74l-.98.98c-.59.59-.59 1.54 0 2.13s1.54.59 2.13 0l.98-.98c.26-.26.7-.16.74.21a3.525 3.525 0 0 1-4.68 3.73l-2.73 2.73c-.59.59-1.54.59-2.13 0s-.59-1.54 0-2.13l2.73-2.73c-.44-1.24-.17-2.68.83-3.67c.79-.79 1.87-1.13 2.9-1.01"/></svg>
</template>

CSS

.icon-developer-tools {
  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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M1%203.5A2.5%202.5%200%200%201%203.5%201h7A2.5%202.5%200%200%201%2013%203.5v1.53c-.33-.04-.67-.04-1%200V5H2v5.5c0%20.83.67%201.5%201.5%201.5h2.95l-.72.72c-.09.09-.17.18-.24.28H3.5A2.5%202.5%200%200%201%201%2010.5zm7.93%203.22l-.58-.58c-.2-.2-.51-.2-.71%200s-.2.51%200%20.71l.74.74q.21-.465.54-.87zM2%204h10v-.5c0-.83-.67-1.5-1.5-1.5h-7C2.67%202%202%202.67%202%203.5zm4.35%202.85c.2-.2.2-.51%200-.71s-.51-.2-.71%200l-2%202c-.2.2-.2.51%200%20.71l2%202c.2.2.51.2.71%200s.2-.51%200-.71L4.7%208.49l1.65-1.65zm6.54-.83c.37.04.47.48.21.74l-.98.98c-.59.59-.59%201.54%200%202.13s1.54.59%202.13%200l.98-.98c.26-.26.7-.16.74.21a3.525%203.525%200%200%201-4.68%203.73l-2.73%202.73c-.59.59-1.54.59-2.13%200s-.59-1.54%200-2.13l2.73-2.73c-.44-1.24-.17-2.68.83-3.67c.79-.79%201.87-1.13%202.9-1.01%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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M1%203.5A2.5%202.5%200%200%201%203.5%201h7A2.5%202.5%200%200%201%2013%203.5v1.53c-.33-.04-.67-.04-1%200V5H2v5.5c0%20.83.67%201.5%201.5%201.5h2.95l-.72.72c-.09.09-.17.18-.24.28H3.5A2.5%202.5%200%200%201%201%2010.5zm7.93%203.22l-.58-.58c-.2-.2-.51-.2-.71%200s-.2.51%200%20.71l.74.74q.21-.465.54-.87zM2%204h10v-.5c0-.83-.67-1.5-1.5-1.5h-7C2.67%202%202%202.67%202%203.5zm4.35%202.85c.2-.2.2-.51%200-.71s-.51-.2-.71%200l-2%202c-.2.2-.2.51%200%20.71l2%202c.2.2.51.2.71%200s.2-.51%200-.71L4.7%208.49l1.65-1.65zm6.54-.83c.37.04.47.48.21.74l-.98.98c-.59.59-.59%201.54%200%202.13s1.54.59%202.13%200l.98-.98c.26-.26.7-.16.74.21a3.525%203.525%200%200%201-4.68%203.73l-2.73%202.73c-.59.59-1.54.59-2.13%200s-.59-1.54%200-2.13l2.73-2.73c-.44-1.24-.17-2.68.83-3.67c.79-.79%201.87-1.13%202.9-1.01%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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