Skip to content
shadcn.io

Note

The note icon represents a musical note.

Add shadcn.io to your AI agent. · Pro It installs Note, or any of 294k icons, from a prompt, with Pro.

Set up MCP

Exports at 24 × 24 px

Note icon from Firefox OS Emoji

Code

Note in your framework

In any framework. Customize it above, and the code follows.

export const NoteIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 512 512" {...props}>
    <path fill="#FFD469" d="M450.812 462.658H74.759a8.8 8.8 0 0 1-8.802-8.802V77.802A8.8 8.8 0 0 1 74.759 69H290.76l168.854 168.854v216.001a8.8 8.8 0 0 1-8.802 8.803"/><path fill="#597B91" d="M242.863 168.403H126.007c-6.613 0-11.974-5.361-11.974-11.974s5.361-11.974 11.974-11.974h116.856c6.613 0 11.974 5.361 11.974 11.974s-5.361 11.974-11.974 11.974m11.974 66.401c0-6.613-5.361-11.974-11.974-11.974H126.007c-6.613 0-11.974 5.361-11.974 11.974s5.361 11.974 11.974 11.974h116.856c6.613-.001 11.974-5.361 11.974-11.974m0 78.374c0-6.612-5.361-11.974-11.974-11.974H126.007c-6.613 0-11.974 5.361-11.974 11.974s5.361 11.974 11.974 11.974h116.856c6.613-.001 11.974-5.362 11.974-11.974m101.165 78.374c0-6.612-5.361-11.974-11.974-11.974H126.007c-6.613 0-11.974 5.361-11.974 11.974s5.361 11.974 11.974 11.974h218.021c6.613-.001 11.974-5.362 11.974-11.974m40.334-78.374c0-6.612-5.361-11.974-11.974-11.974h-80.668c-6.612 0-11.974 5.361-11.974 11.974s5.361 11.974 11.974 11.974h80.668c6.613-.001 11.974-5.362 11.974-11.974"/><path fill="#FFB636" d="m290.76 69l168.854 168.854H326.651c-19.822 0-35.891-16.069-35.891-35.891z"/>
  </svg>
);

Other libraries

Note in 8 more libraries

Each library draws it its own way. Open one to compare.

  • Note icon from Arcticons
  • Note icon from Phosphor
  • Note icon from Material Design Icons
  • Note icon from Tabler Icons
  • Note icon from Huge Icons
  • Note icon from Simple Icons
  • Note icon from BoxIcons
  • Note icon from Siemens Industrial Experience Icons

Firefox OS Emoji

Icons that share its tags, in the same style.

  • Multiplemusicalnotes icon from Firefox OS Emoji
  • Musicalnote icon from Firefox OS Emoji
  • Windchime icon from Firefox OS Emoji
  • Musicalscore icon from Firefox OS Emoji
  • Musicascend icon from Firefox OS Emoji
  • Musicdescend icon from Firefox OS Emoji
  • Saxophone icon from Firefox OS Emoji
  • Speaker icon from Firefox OS Emoji
  • Speaker3soundwaves icon from Firefox OS Emoji
  • Speakeronesoundwave icon from Firefox OS Emoji
  • Speakerwith1soundwave icon from Firefox OS Emoji
  • Trumpet icon from Firefox OS Emoji
  • Doveofpeace icon from Firefox OS Emoji
  • Guitar icon from Firefox OS Emoji
  • Headphone icon from Firefox OS Emoji
  • Hushed icon from Firefox OS Emoji
  • Loudspeaker icon from Firefox OS Emoji
  • Negativesquaredab icon from Firefox OS Emoji
  • Rightspeaker icon from Firefox OS Emoji
  • Rightspeaker3soundwaves icon from Firefox OS Emoji
  • Violin icon from Firefox OS Emoji
  • 2hearts icon from Firefox OS Emoji
  • Bird icon from Firefox OS Emoji
  • Blackdroplet icon from Firefox OS Emoji

Skip the copy and paste. With Pro, your AI agent finds and installs any Firefox OS Emoji icon from a prompt.

Get Pro

Tags

Browse by tag

Note is tagged symbol, music, sound and 5 more. Related tags follow; each opens its icons from every library.

Pricing

Firefox OS Emoji MCP, with Pro

Ask for Note or any of 1,034 Firefox OS Emoji 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.

Billed once a year in USD. Cancel anytime.

Individual

For personal projects & open source

$32instead of $49/mo

$389 billed yearly

  • How many people can use the license.Seats: 1 seat
  • Client work, SaaS products and anything you charge for.Commercial use: Personal & open source only
  • Production-ready React sections: hero, pricing, features, dashboards and more.Pro blocks: 6,000+ blocks
  • Complete multi-page sites you can ship as they are.Templates: All 14 templates
  • React icons from every major library, installable with one command.React icons: 294k+ icons
  • Presets that restyle every block, in light and dark.Themes: All 59 themes
  • Lets your AI editor search, preview and install blocks for you.MCP server: Basic usage
  • Priority requests are answered first.Support: Standard

Team

Most popular

For freelancers, agencies & startups

$66instead of $99/mo

$789 billed yearly · ≈ $13/dev/mo

Everything in Individual, plus

  • How many people can use the license.Seats: Up to 5 seats
  • Client work, SaaS products and anything you charge for.Commercial use: Included
  • Lets your AI editor search, preview and install blocks for you.MCP server: High usage
  • Priority requests are answered first.Support: Priority

Organization

For companies with larger teams

$132instead of $199/mo

$1,589 billed yearly

Everything in Team, plus

  • How many people can use the license.Seats: Unlimited seats
  • Lets your AI editor search, preview and install blocks for you.MCP server: Unlimited usage
  • 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 Note icon means and where it's used, then how to install, style and license it.

Install Note from a prompt

MCP, 6,000+ blocks and 14 premium templates in every Pro plan. The icons stay free.

Get Pro