Developer Board icon

Use the Developer Board icon in React

Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.

npm install @fluentui/react-icons

import { DeveloperBoard24Regular, DeveloperBoard24Filled } from "@fluentui/react-icons";

export function Example() {
  return <DeveloperBoard24Regular aria-label="Developer Board" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_developer_board_24_regular.svg" width="24" height="24" alt="Developer Board">

Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:

<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.25 2C15.6297 2 15.9435 2.28215 15.9932 2.64823L16 2.75L16.0005 5.07512C17.4697 5.37357 18.6269 6.53092 18.925 8.00018L21.25 8C21.6642 8 22 8.33579 22 8.75C22 9.1297 21.7178 9.44349 21.3518 9.49315L21.25 9.5H19V11.25H21.25C21.6297 11.25 21.9435 11.5322 21.9932 11.8982L22 12C22 12.3797 21.7178 12.6935 21.3518 12.7432L21.25 12.75H19V14.5H21.25C21.6297 14.5 21.9435 14.7822 21.9932 15.1482L22 15.25C22 15.6297 21.7178 15.9435 21.3518 15.9932L21.25 16L18.9248 16.0008C18.6263 17.4696 17.4694 18.6265 16.0005 18.9249L16 21.25C16 21.6642 15.6642 22 15.25 22C14.8703 22 14.5565 21.7178 14.5068 21.3518L14.5 21.25V18.999H12.749L12.75 21.25C12.75 21.6297 12.4678 21.9435 12.1018 21.9932L12 22C11.6203 22 11.3065 21.7178 11.2568 21.3518L11.25 21.25L11.249 18.999H9.5V21.25C9.5 21.6297 9.21785 21.9435 8.85177 21.9932L8.75 22C8.3703 22 8.05651 21.7178 8.00685 21.3518L8 21.25L8.00046 18.9251C6.53088 18.627 5.37329 17.4695 5.07501 16L2.75 16C2.33579 16 2 15.6642 2 15.25C2 14.8703 2.28215 14.5565 2.64823 14.5068L2.75 14.5L5 14.499V12.749L2.75 12.75C2.3703 12.75 2.05651 12.4678 2.00685 12.1018L2 12C2 11.6203 2.28215 11.3065 2.64823 11.2568L2.75 11.25L5 11.249V9.499L2.75 9.5C2.3703 9.5 2.05651 9.21785 2.00685 8.85177L2 8.75C2 8.3703 2.28215 8.05651 2.64823 8.00685L2.75 8L5.07521 7.99904C5.37381 6.53 6.53121 5.37297 8.00046 5.07492L8 2.75C8 2.33579 8.33579 2 8.75 2C9.1297 2 9.44349 2.28215 9.49315 2.64823L9.5 2.75V4.999H11.249L11.25 2.75C11.25 2.3703 11.5322 2.05651 11.8982 2.00685L12 2C12.3797 2 12.6935 2.28215 12.7432 2.64823L12.75 2.75L12.749 4.999H14.5V2.75C14.5 2.40482 14.7332 2.11411 15.0506 2.02679L15.1482 2.00685L15.25 2ZM15.25 6.5H8.75C7.50736 6.5 6.5 7.50736 6.5 8.75V15.25C6.5 16.4926 7.50736 17.5 8.75 17.5H15.25C16.4926 17.5 17.5 16.4926 17.5 15.25V8.75C17.5 7.50736 16.4926 6.5 15.25 6.5ZM12.0049 9.00493C13.6618 9.00493 15.0049 10.3481 15.0049 12.0049C15.0049 13.6618 13.6618 15.0049 12.0049 15.0049C10.3481 15.0049 9.00493 13.6618 9.00493 12.0049C9.00493 10.3481 10.3481 9.00493 12.0049 9.00493ZM12.0049 10.5049C11.1765 10.5049 10.5049 11.1765 10.5049 12.0049C10.5049 12.8334 11.1765 13.5049 12.0049 13.5049C12.8334 13.5049 13.5049 12.8334 13.5049 12.0049C13.5049 11.1765 12.8334 10.5049 12.0049 10.5049Z" fill="currentColor"/></svg>

Use it from the SVG package

Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:

npm install @fluentui/svg-icons

import icon from "@fluentui/svg-icons/icons/developer_board_24_regular.svg";

Details

Keywords

circuitchipdevicememoryprocesspowercpu