I'll leave the original page below in case anyone wants an alternative, or for historical interest.
How to display the Bitcoin symbol using a webfont (obsolete)
I couldn't find an easy way to display a Bitcoin symbol in text on a web page, so I created a small webfont with the Bitcoin symbol ฿.By adding this webfont to a page, you can put Bitcoin symbols into your text. The following is an example of use with different text fonts:
This demonstrates the Bitcoin symbol ฿ used in text ฿123.
The Bitcoin symbol ฿ scales with the font like this ฿123.
Large text: ฿0.456.
Note that the symbol above is not an image, but an actual font character in the text. You can zoom the page or print the page, and the symbol will remain smooth. (If you see ฿ or a box instead of the Bitcoin symbol above, something went wrong.)
How to use it
- Download the font file here, unzip and put on your web server.
- Insert the following CSS into your web page:
<style>@font-face { font-family: 'bitcoinregular'; src: url('bitcoin-webfont.eot'); src: url('bitcoin-webfont.eot?#iefix') format('embedded-opentype'), url('bitcoin-webfont.woff2') format('woff2'), url('bitcoin-webfont.woff') format('woff'), url('bitcoin-webfont.ttf') format('truetype'); font-weight: normal; font-style: normal;}</style> - Use
style="font-family: bitcoinregular, arial, sans-serif"on your text. - Insert the Bitcoin symbol in your text. You can use HTML entity฿ or you can use the UTF-8 character฿ directly.
How it works
The webfont defines two characters: Bitcoin symbol without serifs and Bitcoin symbol with serifs. These are mapped to the Unicode characters U+0243 and U+0e3f. So when you use the characterɃthe font displaysɃand when you use฿the font displays฿.The Bitcoin symbols could be assigned to any characters; I used these since many people already use these characters as a stand-in for the Bitcoin symbol.
Some browser still don't support webfonts. If you see square boxes or the wrong characters on this page, your browser probably doesn't support webfonts and this page will make no sense.Here's a screenshot of what you should see above:
For an explanation of webfonts, see here or here.
Why do this?
Without an easy way to use the standard symbol for Bitcoin, people end up using substitutes such as Ƀ and ฿. Text would look nicer with the standard Bitcoin symbol ฿.And once the Bitcoin symbol is in common use in text, it will be much easier to get it added to Unicode and available automatically.
Technical notes
The page has been tested on Chrome (Windows/Mac), IE (Windows), Safari (Windows/Mac), and Firefox (Windows). If it's broken for you, let me know your browser and system.The font was generated from the Bitcoin logo with Inkscape, Font Forge, and Font Squirrel based on the icon webfont process here. Undoubtedly someone with font design skills could do much better.My webfonts originally failed to display with "Missing Cross-Origin Resource Sharing (CORS) Response Header" error because my webpage is at righto.com and the fonts are at files.righto.com (a different domain). I added the Cross-Origin header to fix this.If you want to view-source and see how it works, a simpler version of the page is at http://righto.com/bitcoinfont.
