Add Musical Symbols to Your Web Page
Difficulty: Easy
Time Required: 3 minutes
Here's How:
- Open the page where you want the musical symbols in your Web editor.
- Position your cursor where you want the musical symbols.
- Make sure you are in code editing mode, not WYSIWYG.Type:
♩ - quarter note
♪ - eigth note
♬ - two eighth notes
♭ - flat
♯ - sharp - Save your file and open it in a Web browser to test that it worked. You should see: ♩, ♪, ♬, ♭, or ♯
Tips:
- Another way you can get the musical symbols to display is to simply copy and paste them from the screen to your editor. However, not all browsers will display it this way reliably.
- WYSIWYG-only editors can copy and paste the musical symbols into the WYSIWYG mode, and the editor should convert it for you.
- You can use CSS text styles to change the color of the musical symbols and font styles to change the size and weight (boldness) of the musical symbols.
What You Need
- Web editor

