All the Hyphens & Dashes

Typography is inspiring :) I recently posted about all the different HTML “X” characters. Then a tweet from Helge Klein inspired me to write a follow-up post showing all the different ways to write a dash or hyphen - character in HTML. Like most online content creators, I knew about – and —. But I didn’t realize there were so many other hyphen and dash characters.

40+ hyphen, dash, and minus characters for HTML content creators.

Contents

• Only characters that “look” like a hyphen
• Dash characters
  • Dash
  • En Dash
  • Em Dash
  • Circle Dash
  • Other dash characters
• Hyphen characters
  • Hyphen
  • Non-Breaking Hyphen
  • Hyphenation Point
  • Hyphen Bullet
  • Hyphen Minus
  • Other hyphen characters
• Minus Characters
  • Minus Sign
  • Plus-Minus Sign
  • Other minus characters
• Honorable Mentions
• The ones to remember ☆

Only characters that “look” like a hyphen

There are many “dash”, “hyphen”, and “minus” type characters defined for HTML. Some of them actually look like dashes or hyphens, others not so much. For example the Box Drawings Heavy Double Dash Vertical ╏ and the Negated Double Vertical Bar Double Right Turnstile ⊯. It gets crazy fast. So for this article, we’re just gonna focus on the HTML characters that actually look like dashes or hyphens. You know, made with a short horizontal scrawl motion.

Dash characters

The set of “dash-like” HTML dash characters contains four characters, the dash, en dash, em dash, and circle dash. Here they are, in all their glory.

Dash

The common dash character is used all the time in writing, it is the same character as the hyphen, described below. To add a hyphen in your text, simply press the - key on your keyboard. It looks like this:

–

En Dash

The en dash punctuation mark is commonly used to designate a span of numerical values. It’s also used for things like compound adjectives and designating conflicting or connecting ideas. It looks like a regular hyphen, only a bit longer:

–

Em Dash

The em dash punctuation mark often is confused with the en dash. The em dash is a versatile character, used in place of commas, parentheses, colons, etc. In general, em dash provides more emphasis, and should not be used more than once per sentence.

—

Circle Dash

Almost didn’t include the circled dash, as it’s intended for use with mathematical writing and not super common among content creators. It looks like this:

⊝

Other dash characters

In addition to the above, there are some further dash characters that can be used when creating HTML content. I think out of all of these, the regular tilde ~ is the only one that I’ll ever use. Just in case though..

Hyphen characters

When writing, hyphens are used to connect words, denote line endings, and do other things. There are many variations on this hyphen, including the following characters.

Hyphen

The hyphen is a punctuation mark that connects words or parts of words (like at the end of a line). For example, “ramp-up” or “down-low”, both hyphenated words joined together to get a new combined meaning. The humble hyphen as such:

–

Non-Breaking Hyphen

The non-breaking hyphen is the same as a regular hyphen, but it is not allowed to break (like at the end of a line). So, same as the hyphen with no breaking:

–

Hyphenation Point

The hyphenation point is used to specify where a would should be broken, usually between syllables. Think “dic·tion·ar·y” definitions and so forth. Important: do NOT use this character in domain names, as it opens potential phishing vulnerabilities.

‧

Hyphen Bullet

The hyphen bullet punctuation mark is nothing more than a bullet character dressed up like a hyphen. It’s difficult to find any real use for this character.

⁃

Hyphen Minus

From what I understand, the hyphen minus is the same thing as the regular hyphen. It can be used as a hyphen, minus sign, or dash, depending on context.

–

Other hyphen characters

There are so many “hyphen” characters it’s just stupid. I think I’ve covered the most commonly used hyphens so far. Here are a bunch more, just to give you an idea of how crazy it gets..

Minus characters

Technically all “minus” punctuation marks are for use in mathematical writing. As might be expected with math characters, there are several variations of the minus-sign punctuation mark. Let’s take a look..

Minus Sign

Used in mathematics like 8 – 1 = 7. Surely anyone reading is familiar with this common character:

−

Plus-Minus Sign

The plus-minus sign has multiple meanings, depending on context. For example, in mathematics, it denotes two values. In statistics, it denotes a range of uncertainty or confidence interval. It looks like this:

±

Other minus characters

As with hyphens and dashes, there are all sorts of variations on the ol’ minus sign. Here are the ones I could find..

Honorable Mentions

During the course of my research on this topic, I stumbled upon a few others probably worth mentioning. Even though the overline and double low line look hideous due to extreme baselines imo. So maybe dishonorable mentions lol.

The ones to remember

Told you there were a lot of HTML hyphen-ish characters. In my experience (many years of writing and creating content online), out of the 40+ hyphen/dash characters, here are the only ones you’ll ever need to remember:

Honestly just knowing the difference between Dash ‐, En Dash –, and Em Dash — makes you a typography wizard, or at least a hyphen wizard.

You can find more details about these and other HTML entities at reference sites such as compart.com and jkorpela.fi.

About the Author

Jeff Starr = Web Developer. Book Author. Secretly Important.