Drum
The drum icon represents a symbol of music or rhythm, often used in contexts related to game design, thematic representations, and audio elements.
Exports at 24 × 24 px
Code
Drum in your framework
In any framework. Customize it above, and the code follows.
export const DrumIcon = (props: React.SVGProps<SVGSVGElement>) => (
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 512 512" {...props}>
<path fill="currentColor" d="M476.865 25.514L282.941 145.422l19.32 9.215L486.333 40.822l-9.467-15.308zM73.6 65.508l-7.748 16.246l286.595 136.709l1.389 2.715c3.244 6.346 9.677 12.524 17.723 16.373l.003.002l.004.002c8.566 4.084 17.188 5.364 23.63 4.373c6.443-.992 10.352-3.63 12.523-8.18s1.665-8.39-1.725-13.603s-10.122-10.882-18.935-15.086c-8.063-3.843-16.927-4.961-23.91-3.487l-2.983.63zm121.097 97.65c-40.936 2.913-77.435 8.644-106.084 16.283c-21.165 5.644-38.06 12.392-48.953 19.26S25 211.723 25 216s3.767 10.43 14.66 17.299s27.788 13.616 48.953 19.26C130.943 263.847 190.374 271 256 271c49.18 0 94.88-4.017 132.512-10.781c-8.123-.325-16.546-2.53-24.703-6.422l-.002-.002l-.004-.002c-10.2-4.878-18.614-12.38-24.135-21.484l-72.705-34.68l-36.498 22.566c-4.5 9.65-12.051 18.021-21.662 23.977l-.002.002l-.004.002c-10.715 6.625-22.297 10.072-33.281 9.588c-10.985-.484-21.794-5.485-27.856-15.29c-6.062-9.803-5.366-21.696-.515-31.294c4.85-9.598 13.3-17.76 23.785-24.243l.002-.001h.002c9.63-5.951 20.504-8.973 31.16-8.688l6.904-4.27l-14.3-6.82zm127.432.36l-.545.336l41.3 19.7c10.563-1.44 21.702.385 31.92 5.257h.005c11.125 5.306 20.412 12.504 26.275 21.52c5.863 9.014 7.844 20.763 2.88 31.167c-3.08 6.457-8.178 11.27-14.2 14.395c4.699-1.07 9.273-2.174 13.623-3.334c21.165-5.644 38.06-12.392 48.953-19.26S487 220.277 487 216s-3.767-10.43-14.66-17.299s-27.788-13.616-48.953-19.26c-27.516-7.337-62.286-12.91-101.258-15.923m-93.81 15.677l-21.499 13.293l-3.033-.3c-7.102-.708-15.793 1.364-23.39 6.058l-.002.002c-8.305 5.135-14.382 11.502-17.186 17.05c-2.804 5.55-2.89 9.422-.238 13.71c2.651 4.288 6.822 6.486 13.336 6.773c6.513.287 14.949-1.923 23.023-6.916c7.58-4.699 13.305-11.538 15.842-18.199l1.086-2.85l31.383-19.404zM39.642 253.912l26.941 44.9l33.31-24.982a409 409 0 0 1-15.92-3.879c-17.352-4.627-32.253-9.928-44.331-16.039m432.714 0c-12.078 6.11-26.98 11.412-44.332 16.04c-6.926 1.846-14.283 3.565-21.949 5.175l38.926 24.377zM487 264.492l-17.576 29.293a91 91 0 0 0 2.209-.97c5.948-2.72 10.255-5.583 12.627-7.944S487 281.188 487 280zm-462 .002V280c0 1.188.369 2.51 2.74 4.871s6.679 5.224 12.627 7.943q1.07.49 2.207.971zm98.639 14.027l-36.737 27.553c1.874.36 3.74.72 5.674 1.065c21.728 3.862 47.224 6.792 74.612 8.775l-36.143-36.143a574 574 0 0 1-7.406-1.25m233.996 4.538c-23.345 2.877-48.603 4.787-75.155 5.552l37.08 27.809zm27.261.045l-37.195 32.59c26.286-1.979 50.764-4.83 71.723-8.555c1.011-.18 1.972-.373 2.967-.557zm-224.369.697l32.317 32.316l36.676-27.506c-24.226-.698-47.389-2.342-68.993-4.81M256 291.25l-36.322 27.242c12.024.332 24.171.508 36.322.508c12.15 0 24.298-.176 36.322-.508zM25 305.121V440c0 5.5 4.3 11.699 16.09 18.436c3.953 2.259 8.63 4.452 13.91 6.554V317.13c-8.28-2.377-15.693-5.007-22.117-7.943c-2.813-1.287-5.44-2.63-7.883-4.065zm462 0c-2.443 1.435-5.07 2.778-7.883 4.065c-6.424 2.936-13.838 5.566-22.117 7.943V464.99c5.28-2.103 9.957-4.295 13.91-6.554C482.7 451.699 487 445.5 487 440zM73 321.63v149.488c6.196 1.816 12.868 3.523 19.953 5.098c25.716 5.714 56.789 9.79 90.047 12.2V334.978c-34.264-1.945-66.46-5.297-93.576-10.118A430 430 0 0 1 73 321.63m366 0a430 430 0 0 1-16.424 3.232c-27.115 4.82-59.312 8.173-93.576 10.118v153.435c33.258-2.409 64.331-6.485 90.047-12.2c7.085-1.574 13.757-3.281 19.953-5.097zm-238 14.24v153.684a1039 1039 0 0 0 55 1.445c18.483 0 36.972-.485 55-1.445V335.87c-18.053.752-36.52 1.129-55 1.129s-36.947-.377-55-1.129"/>
</svg>
);Other libraries
Drum in 8 more libraries
Each library draws it its own way. Open one to compare.
Game Icons
More like it
Icons that share its tags, in the same style.
Search Game Icons
Skip the copy and paste. With Pro, your AI agent finds and installs any Game Icons icon from a prompt.
Get ProTags
Browse by tag
Drum is tagged audio, music, game and 3 more. Related tags follow; each opens its icons from every library.
Pricing
Game Icons MCP, with Pro
Ask for Drum or any of 4,123 Game Icons icons and your agent installs it. The MCP comes with every Pro plan, with 6,000+ blocks and 14 premium templates. The icons stay free.
4.9/5 out of 5 · 150+ reviewsfrom 150+ founders and developers.
- Secure checkout via Stripe
- Code lives in your repo
- Keep what you've shipped if you cancel
- License terms
FAQ
Frequently asked questions
What the Drum icon means and where it's used, then how to install, style, label and license it.
The drum icon represents a symbol of music or rhythm, often used in contexts related to game design, thematic representations, and audio elements.
In real-world applications, this icon may appear in software related to music production, game development, and design platforms that utilize thematic icons.
From a UX perspective, the drum icon communicates a sense of energy or beat, helping users understand functionality related to audio or music elements.
Drum is one of 4,123 icons in Game Icons, made by GameIcons and released under CC BY 3.0. It is drawn on a 512 × 512 grid.
Sign in (it's free), then open Get icon, Install with shadcn CLI, and pick your package manager to copy the command. It adds DrumIcon to components/icons/game-icons-drum.tsx: one file, a size prop (24 by default) and every SVG prop, with no icon package.
Copy it as React (from Get icon, or the Code section): a typed DrumIcon component you paste into your project, with no package to install. Only the icons you import reach your bundle. It works in Next.js and any React app.
Open Get icon, then Copy as code, and pick Vue, Svelte, Angular, Solid or Preact; the Code section shows each one too. Every version is one self-contained component with the SVG inside, and SVG and data URL copies are there for plain HTML and CSS.
With Pro, the shadcn.io MCP server lets Claude Code, Cursor or any MCP client find the Drum icon, or any of 4,123 Game Icons icons, and install it from a prompt.
It's drawn in currentColor, so it takes the text color wherever you use it: a class like text-primary recolors it. To bake a color in, set one in Customize before you copy.
Set width and height on the component, or a class like size-6. It's drawn on a 512 × 512 grid, so it stays sharp at any size. Customize also sets the size it exports at, its padding and rotation.
Yes. It follows the text color, so with text-foreground (or any theme token) it changes with your light and dark themes. The icon is a vector, so it needs no separate dark asset.
Next to a visible label it's decoration: add aria-hidden="true" so screen readers skip it. Standing alone, as in an icon button, give the button a name instead, like aria-label="Drum", so screen readers say what it does.
Yes. DrumIcon passes every SVG prop to the svg element, so <DrumIcon aria-hidden="true" /> works, and so do role="img" with aria-label, or a title child, when it carries meaning on its own.
Yes. Open Get icon, then Download file: SVG for code or design tools like Figma; PNG, WebP or JPEG at 512px; or an ICO favicon with 16, 32 and 48px inside. Each one uses what you set in Customize.
Yes, with credit: CC BY 3.0 asks you to credit the author (GameIcons) where you use the icons. The full terms are in the license, linked on this page.
Yes. CC BY 3.0 asks you to credit the author where you use the icons, for example "Icons by GameIcons, CC BY 3.0" on an about or credits page.
Yes. Copying and downloading it is free, and the shadcn CLI install only needs a free account.
8 other libraries draw an icon called Drum. The Other libraries section on this page shows each one, so you can compare them and open the one that fits your style.
Its tags are audio, music, game, thematic, instrument and rhythm. Each tag page lists the icons that carry it from every library, which is the quickest way to find a match for Drum in another set.
4.9 out of 5 from 150+ developers
Install Drum from a prompt
MCP, 6,000+ blocks and 14 premium templates in every Pro plan. The icons stay free.
Get Pro