I think you're using less-well-supported Unicode values, which don't always have glyphs for all the code points.
Try the following characters:
- ☐ (0x2610 in Unicode hexadecimal [HTML decimal:
☐]): an empty (unchecked) checkbox - (0x2611 [HTML decimal:
☑]): the checked version of the previous checkbox - ✓ (0x2713 [HTML decimal:
✓]) - (0x2714 [HTML decimal:
✔])
Edit: There seems to be some confusion about the first symbol here, ☐ / 0x2610. This is an empty (unchecked) checkbox, so if you see a box, that's the way it's supposed to look. It's the counterpart to / 0x2611, which is the checked version.
Answer from John Feminella on Stack OverflowI think you're using less-well-supported Unicode values, which don't always have glyphs for all the code points.
Try the following characters:
- ☐ (0x2610 in Unicode hexadecimal [HTML decimal:
☐]): an empty (unchecked) checkbox - (0x2611 [HTML decimal:
☑]): the checked version of the previous checkbox - ✓ (0x2713 [HTML decimal:
✓]) - (0x2714 [HTML decimal:
✔])
Edit: There seems to be some confusion about the first symbol here, ☐ / 0x2610. This is an empty (unchecked) checkbox, so if you see a box, that's the way it's supposed to look. It's the counterpart to / 0x2611, which is the checked version.
First off, you should realize that you don't actually need to use HTML entities – as long as your HTML document's encoding is declared properly as UTF-8, you can simply copy/paste these symbols into your file/server-side script/JavaScript/whatever.
Having said that, here's the exhaustive list of all relevant UTF-8 characters / HTML entities related to this topic:
- ☐ (hex:
☐/ dec:☐): ballot box (empty, that's how it's supposed to be) - (hex:
☑/ dec:☑): ballot box with check - ☒ (hex:
☒/ dec:☒): ballot box with x - ✓ (hex:
✓/ dec:✓): check mark, equivalent to✓and✓in most browsers - (hex:
✔/ dec:✔): heavy check mark - ✗ (hex:
✗/ dec:✗): ballot x - ✘ (hex:
✘/ dec:✘): heavy ballot x - 🗸 ( hex:
🗸/ dec🗸): light check mark (poorly supported as of 2017) - ( hex:
✅/ dec:✅): white heavy check mark (mixed support as of 2017) - 🗴 ( hex:
🗴/ dec:🗴): ballot script X (poorly supported as of 2017) - 🗶 ( hex:
🗶/ dec:🗶): ballot bold script X (poorly supported as of 2017) - ⮽ ( hex:
⮽/ dec:⮽): ballot box with light X (poorly supported as of 2017) - 🗵 ( hex:
🗵/ dec:🗵): ballot box with script X (poorly supported as of 2017) - 🗹 ( hex:
🗹/ dec:🗹): ballot box with bold check (poorly supported as of 2017) - 🗷 ( hex:
🗷/ dec:🗷): ballot box with bold script X (poorly supported as of 2017)
Checking out web fonts for tick symbols? Here's a ready to use sample for the more common ones: A☐BC☒D✓EF✗G✘H -- just copy/paste this into your webfont provider's sample text box and see which fonts support what tick symbols.
Check it with typeof:
typeof x === 'symbol'
Updated 2022: Go with the accepted answer! If you're working in an environment so outdated that Symbol needs to be polyfilled, then you'll know that already. You'll be excruciatingly aware of it. You'll be haunted by it. Then, sure, use my answer. Otherwise don't bother. typeof x === 'symbol' is almost definitely all you need these days.
In ES 2015 and up, typeof x === 'symbol' is all that's needed. But it won't work if you're transpiling your code to ES 5.1 or earlier, even if you're using a polyfill for the Symbol builtin.
Every polyfill I've seen, including the babel-polyfill, implements Symbol as an object (i.e. typeof x === 'object') using a constructor function called Symbol. So in those cases you can check that Object.prototype.toString.call (x) === '[object Symbol]'*.
Putting it all together, then, we get:
function isSymbol (x) {
return typeof x === 'symbol'
|| typeof x === 'object' && Object.prototype.toString.call (x) === '[object Symbol]';
}
*Note that I'm not using instanceof in the transpiled scenario. The problem with instanceof is that it only returns true for objects that were created within the same global context as the assertion being made. So if, say, a web worker passes a symbol back to your page, or symbols are passed between iframes, then x instanceof Symbol will return false! This has always been true of all object types, including the builtins. instanceof often works just fine, but if there's any chance of your code being in a "multi-frame" scenario as I've described, use with caution!