5

I am working on a web page that displays some music note names such as "B", "Bb" (B flat), or C# (C sharp). For a better readability I would prefer to display the correct flat and sharp symbols.

It seems that the standard sans-serif fonts such as Arial or Helvetica do not support these symbols, which leads me to the conclusion that I need to find a web font that looks similar to the widespread sans-serifs (Arial, Helvetica) and in addition has these two symbols.

Q1: Do you know of any such web font?

Q2: Or was I completely mistaken and the Arial and Helvetica actually do support musical notation symbols, and they happen to be in the same position for both of these fonts?

Improve this question
2
  • Very view fonts implement more than a tiny handful of unicode symbols. Might consider some specific music fonts. I know they exist but I don't know which to recommend.
    – Ben Brocka
    Apr 18, 2012 at 18:12
  • Standard fonts such as Arial and Helvetica do support these symbols. See my answer as proof of this, as those are the fonts actually used here on this site..!
    – Aᵂᴱ
    Jan 27, 2014 at 10:31

2 Answers 2

Reset to default
6

If using unicode characters, this will be available for a wide range of fonts.

Here you can see how to program these symbols in HTML as unicode, and how it is displayed here in the font used on this page:

♭ will show as: ♭

♮ will show as: ♮

♯ will show as: ♯

You can also copy the characters directly and paste them in as you like:

♭♮♯ will show as: ♭♮♯

Improve this answer
1

I think you just have to know where to look.

There are at least three available as web fonts: Music Sheets, P22 Music and P22 Music Pro.

Improve this answer
3
  • See also stackoverflow.com/questions/10209549/…
    – Andrew Leach
    Apr 19, 2012 at 10:52
  • Thank's Andrew. What I was looking for is a web font that renders the ASCII set (at least) just like a sans-serif font does but provides a FLAT and SHARP sign in its Dingbats set.
    – chiccodoro
    Apr 19, 2012 at 15:03
  • 2
    OK. If you go to alanwood.net/unicode/miscellaneous_symbols.html you can test fonts. Unicode 266D, 266E and 266F appear to be the right symbols, and they might be read out correctly by screen-readers. In fact I wonder if ♭ will be rendered as a flat by browsers anyway.
    – Andrew Leach
    Apr 19, 2012 at 15:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.