Keyboard Bold icon

solar:keyboard-bold

The Keyboard Bold icon (solar:keyboard-bold) is a free SVG icon from the Solar set by 480 Design. It is drawn on a 24 × 24 grid. Solar icons are released under the CC BY 4.0 license, which allows use in personal and commercial projects as long as you credit the author. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set: Solar
Author: 480 Design
License: CC-BY-4.0
Size: 24 × 24
Category: Devices
Tags: keyboardbold

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M8 5H16C18.8284 5 20.2426 5 21.1213 5.87868C22 6.75736 22 8.17157 22 11V13C22 15.8284 22 17.2426 21.1213 18.1213C20.2426 19 18.8284 19 16 19H8C5.17157 19 3.75736 19 2.87868 18.1213C2 17.2426 2 15.8284 2 13V11C2 8.17157 2 6.75736 2.87868 5.87868C3.75736 5 5.17157 5 8 5ZM6 10C6.55228 10 7 9.55228 7 9C7 8.44772 6.55228 8 6 8C5.44772 8 5 8.44772 5 9C5 9.55228 5.44772 10 6 10ZM6 13C6.55228 13 7 12.5523 7 12C7 11.4477 6.55228 11 6 11C5.44772 11 5 11.4477 5 12C5 12.5523 5.44772 13 6 13ZM9 13C9.55228 13 10 12.5523 10 12C10 11.4477 9.55228 11 9 11C8.44772 11 8 11.4477 8 12C8 12.5523 8.44772 13 9 13ZM9 10C9.55228 10 10 9.55228 10 9C10 8.44772 9.55228 8 9 8C8.44772 8 8 8.44772 8 9C8 9.55228 8.44772 10 9 10ZM12 10C12.5523 10 13 9.55228 13 9C13 8.44772 12.5523 8 12 8C11.4477 8 11 8.44772 11 9C11 9.55228 11.4477 10 12 10ZM12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13ZM15 10C15.5523 10 16 9.55228 16 9C16 8.44772 15.5523 8 15 8C14.4477 8 14 8.44772 14 9C14 9.55228 14.4477 10 15 10ZM15 13C15.5523 13 16 12.5523 16 12C16 11.4477 15.5523 11 15 11C14.4477 11 14 11.4477 14 12C14 12.5523 14.4477 13 15 13ZM18 10C18.5523 10 19 9.55228 19 9C19 8.44772 18.5523 8 18 8C17.4477 8 17 8.44772 17 9C17 9.55228 17.4477 10 18 10ZM18 13C18.5523 13 19 12.5523 19 12C19 11.4477 18.5523 11 18 11C17.4477 11 17 11.4477 17 12C17 12.5523 17.4477 13 18 13ZM17.75 16C17.75 16.4142 17.4142 16.75 17 16.75H7C6.58579 16.75 6.25 16.4142 6.25 16C6.25 15.5858 6.58579 15.25 7 15.25H17C17.4142 15.25 17.75 15.5858 17.75 16Z" clip-rule="evenodd"/></svg>

How to use the Keyboard Bold icon

React

import { Icon } from "@iconify/react";

<Icon icon="solar:keyboard-bold" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="solar:keyboard-bold" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="solar:keyboard-bold" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[solar--keyboard-bold]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/solar -->
<div class="i-solar:keyboard-bold"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="solar:keyboard-bold"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/solar/keyboard-bold.svg" alt="Keyboard Bold icon" width="24" height="24">

Related icons in Solar

Keyboard Bold icon in other icon sets

Keyboard Bold icon FAQ

Is the Keyboard Bold icon free for commercial use?

Yes. Solar icons are released under the CC BY 4.0 license, which allows use in personal and commercial projects as long as you credit the author.

How do I use the Keyboard Bold icon in React?

Install @iconify/react and render <Icon icon="solar:keyboard-bold" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Keyboard Bold icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/solar/keyboard-bold.svg" alt="Keyboard Bold icon">, or paste the SVG code inline to style it with CSS.

Browse all Solar icons →