Download and Use The Font

Fork me on GitHub

If you want to incorporate the symbols into your font, you can download the Power Symbol font files from GitHub.

You want to start using these symbols straight away? Ok! Here are fonts which are suitable for use on your computer or as embedded web fonts.

All these fonts are free to use and reuse. We’d love to see people incorporating these into their existing fonts.

Webfont

If you want to embed these fonts on a webpage, download the woff and woff2 files and place the following in your CSS.

@font-face {
    font-family: 'power_symbols';
    src: url('Unicode_IEC_symbol.woff2') format('woff2'),
         url('Unicode_IEC_symbol.woff') format('woff'),
    font-weight: normal;
    font-style: normal;
}

.power{
  font-family: 'power_symbols';
  font-style: normal;
}

In your HTML you can then use something like:

<p>To switch the console on:
Press the <span class="power">&#x23FB;</span> button.</p>

You can use CSS colours to change the appearance, for example :

<span class="power" style="color:red;">&#x23FB;</span>

This table shows the HTML Escape code for each symbol.

Character Escape Code Symbol
Power &#x23FB;
Toggle Power &#x23FC;
Power On &#x23FD;
Power Off &#x2B58;
Sleep Mode &#x23FE;

As of 22 June 2016, the symbols are part of Unicode 9.0 and can be used freely!

8 thoughts on “Download and Use The Font

    1. It depends on the Computer :-) Usually double-clicking a .ttf file should prompt your system to install the file,

    1. I’ve re-uploaded the SVG font. You may need to right-click and select “save as” – otherwise your browser will try to download it as an image.

  1. I think there’s a mismatch in the font-family definition and usage in the webfont example. The definition names the family as iec_symbols_unicoderegular, while the iec_power class uses iec_unicoderegular.

Leave a Reply