A web app I'm writing singles out individual characters found on a traditional keyboard. I have a very limited area in which the character can be displayed (which is basically the width of a W character in the font I'm using) meaning I can't display the word "space" or "blank space".

How can I best display the blank space character?

I've tried a couple of options, but I'm not sure if these would just lead to confusion:

  • Example 1 Using underline. This looks a bit too similar to the underscore character.
  • Example 2 The space symbol (␠ (␠)). I didn't even know this existed until I started looking for answers to this question myself, so I'm not sure if this is widely recognised.
  • Example 2 A faint bottom border in a different colour.
  • Example 3 A block character (█ (█)) like those used in a terminal to represent the cursor.
  • Example 4 A blank space with no style applied.

I suppose it's worth noting that this is purely for display purposes; the user has no interaction with the character other than acknowledging it's there when reading through the page (so I'm not asking about What character can I use to represent the space bar?).

  • 12
    Strongly related question: Is the middle dot the best way to signify a space? – Andrew Leach Mar 10 '16 at 16:45
  • 1
    Are all of the characters going to be separated visually? That is, are they all separate boxes that the character lies in? If so, I'd just use no style, unless you have some reason that a single box being empty means something else (like no input). – agweber Mar 10 '16 at 22:23
  • 1
    @JamesDonnelly Actually, I wasn't suggesting the middle dot. Perhaps I should have linked directly to my answer, where I say that middot is not the best character and suggest an "underbracket" or blank-indicator bracket as Ben has below. – Andrew Leach Mar 11 '16 at 8:09
  • 4
    Possible duplicate of What character can I use to represent the space bar? – RedGrittyBrick Mar 11 '16 at 11:24
  • 1
    I do not see this as a duplicate. The proposed duplicate is asking how to represent the use of the physical space bar. This question is asking how to visually represent a blank/space character. – Evil Closet Monkey Mar 11 '16 at 23:06

11 Answers 11



Is not intrusive, and is barely noticeable. And Word users that are familiar with it, will recognize it easily, so you'll have some external consistency.

Based on the comments, I edited this answer to note that is necessary to generate a difference between text and interpunct so I used a slighty bigger font size and changed the color from black to light blue, so it's less noticeable. Also there are some languages (like catalan) that uses this as a character.

Is important to note that this character is used even before the computer era (latin language used it).

  • 31
    a lot of programming-centric text editors use this for trailing whitespace as well, albeit in a faded color. – Woodrow Barlow Mar 10 '16 at 21:24
  • 8
    This is what Notepad++ uses when you ask it to make invisible characters visible (the pilcrow button). – Pharap Mar 10 '16 at 22:23
  • 9
    I too enjoy the interpunct, but as Woodrow points out, a faded color really helps it be less noticeable. I think in your example of black text on white they are quite obtrusive. – agweber Mar 10 '16 at 22:25
  • 3
    Within text, this works very well, but in a standalone key I’m not sure it’s so clear. – PLL Mar 12 '16 at 21:17
  • 2
    Adding to @agweber poing. Fading colour is also important, because some languages use this symbol as part of their grammar (eg, catalan; il·lusió). – igor milla Mar 14 '16 at 8:56

My go to has always been an blank, ␣ (␣) or the underbracket character ⎵ (⎵), which is wider. You can see them here on w3.org. I've used the underbracket a bunch in my programming courses to show space in program output.

For example These␣do␣a␣pretty␣good␣job␣of␣conveying␣a␣space becomes:

example with blank

Make sure you use a font that implements the unicode glyphs so it doesn't break if the users system doesn't have them, or it could look like:

Example with font not containing the glyphs]2

  • 42
    These█do█not█do█a█pretty█good█job█of█conveying█a█space. imgur.com/Uj8fZeKl.png . Please be wary of not using characters that may not exist on the user's system, as this is, in fact, a web app. If you go this route, please please please include the font with the app. – Tyzoid Mar 10 '16 at 22:13
  • 6
    @Tyzoid For sure! If you're going to use unicode make sure the font you're using implements those glyphs. That being said I'm not sure it's unreasonable to expect user's systems to have a font that implements all unicode symbols. For example my system is serving those glyphs from the STIX General. – Brynn Mar 10 '16 at 22:18
  • 2
    @Ben It may be the case for most cases, but I think it is unreasonable to assume users' systems have all unicode symbols available. Mine doesn't, as evidenced by the screenshot of your answer. (Also, for the benefit of people like me, can you include a screenshot of what the text should look like?) – Tyzoid Mar 10 '16 at 22:22
  • 7
    The other advantage of this is you can see where you have multiple space characters in a row. Ie you you tell there are 4 characters here: ⎵⎵⎵⎵ and three here: ⎵⎵⎵, much easier than here: ____ vs. ___ – sixtyfootersdude Mar 11 '16 at 16:45
  • 2
    Also worth saying that these aren't showing up on the SE android app. – SuperBiasedMan Mar 11 '16 at 18:32

Short answer

To represent a space bar of a keyboard, U+23B5 Bottom Square Bracket (normal ⎵ bold monospace ). As alternative, U+2423 Open Box (␣). In HTML parlace, ⎵ and &blank, respectively. To represent spaces in text use the interpunct, U+2E31 Word Separator Middle Dot (⸱) or U+00B7 Middle dot (·) as alternative.

Mind repetition and other punctuation:

  • U+2E31: ⸱⸱⸱⸱Four⸱spaces⸱before,⸱now⸱⸱two,⸱one⸱at⸱end.⸱
  • U+00B7: ····Four·spaces·before,·now··two,·one·at·end.·
  • U+23B5: ⎵⎵⎵⎵Four⎵spaces⎵before,⎵now⎵⎵two,⎵one⎵at⎵end.⎵
  • U+2423: ␣␣␣␣Four␣spaces␣before,␣now␣␣two,␣one␣at␣end.␣

Monoespaced works better:

  • U+2E31: ⸱⸱⸱⸱Four⸱spaces⸱before,⸱now⸱⸱two,⸱one⸱at⸱end.⸱
  • U+00B7: ····Four·spaces·before,·now··two,·one·at·end.·
  • U+23B5: ⎵⎵⎵⎵Four⎵spaces⎵before,⎵now⎵⎵two,⎵one⎵at⎵end.⎵
  • U+2423: ␣␣␣␣Four␣spaces␣before,␣now␣␣two,␣one␣at␣end.␣

Long answer

For space bar, U+23B5 Bottom Square Bracket, HTML ⎵ ( ) is way to go. It's a symbol utilized in keyboards and virtual keyboards of cell phones, but has low font coverage. U+2423 Open Box, HTML &blank (␣) was better supported, looks better with other punctuation but is ugly in isolation: vs .

Visual representation of spaces in text are more diverse beast. In the old days of console, manuals represented spaces as a combination of b and a slash (/). There is a Unicode for that, U+2422 Blank Symbol (␢), but without the same impact of the former representation in most fonts. But the old look or new not help much. Using overlays to simulate the old ways and U+2422 directly:

  • U+0338: Theseb̷dob̷notb̷dob̷ab̷prettyb̷goodb̷jobb̷ofb̷conveyingb̷ab̷space.

  • U+2422: These␢do␢not␢do␢a␢pretty␢good␢job␢of␢conveying␢a␢space.

A modern solution is to use the U+2E31 Word Separator Middle Dot (⸱) or U+00B7 Middle dot (·). The first is advisable, the second has broad font support.


  • A⸱pretty⸱good⸱job⸱of⸱displaying⸱spaces. (U+2E31)
  • A·pretty·good·job·of·displaying·spaces. (U+00B7)
  • A⸱pretty⸱good⸱job⸱of⸱displaying⸱a⸱space. (U+2E31 mono spaced)note
  • A·pretty·good·job·of·displaying·spaces. (U+00B7 mono spaced)

For historical notes, usages and more alternatives, see https://en.wikipedia.org/wiki/Interpunct and https://en.wikipedia.org/wiki/Whitespace_character (buried in Overview/Definition and ambiguity/Unicode/Substitutes).

If I understand correctly, your application is displaying text as keystrokes (or text and special keys). If so, with U-2423:

  • A p r e t t y g o o d j o b o f d i s p l a y i n g k e y s .

  • Aprettygoodjobofdisplayingkeys.

With U-23B5:

  • A p r e t t y g o o d j o b o f d i s p l a y i n g k e y s .

  • Aprettygoodjobofdisplayingkeys.

note In some mono spaced fonts, it's a glyph of different width!

  • There’s U+2422 Blank Symbol, as seen in several other answers. – Crissov Mar 12 '16 at 6:56
  • Thanks, I edited to mention that. I cannot found this before because the new rendering of "b slash" (or "b solidus") is not like the like in the days of typewriters. Gosh, I feel old now. – André LFS Bacci Mar 12 '16 at 15:05
  • I assume Lucida Sans Unicode (of the fonts listed at fileformat.info) matches your expectations the best. – Crissov Mar 12 '16 at 15:43
  • PS: U+2E31 is semantically fine, but badly supported and (if it is) usually looks just like U+00B7, which may have less desirable line breaking behavior but is available universally. U+2027 also looks the same (maybe positioned a bit higher) but is the wrong character for the job, because it joins the words around it – it’s for dictionaries. U+2024/5 are one and two dots on the baseline, which may be better than broad U+2026 or standard period U+002E. – Crissov Mar 12 '16 at 16:07

Can you use color? Wikipedia uses lightblue boxes to show the characters:

enter image description here

But if you're limited to two colors, I would suggest these:

  • ˽ ⎵⎴ - Modifying letter shelf, underbracket or overbracket to represent the button
  • ⬚ ◌ - Dotted circle or square to represent emptiness
  • 👽 👾 🚀 - A comedy option.
  • 37
    Not💩 sure💩 this💩 is💩 a💩 good💩 idea. – Pierre Arlaud Mar 11 '16 at 9:11
  • 8
    @PierreArlaud I didn't even mention that shit. – PixelSnader Mar 12 '16 at 13:21
  • @PierreArlaud Your idea is full of crap! We laughed our 💩 producers off, when we've read it. – Konrad Viltersten Mar 13 '16 at 8:52

␣   ␣

Wikipedia lists the following characters for this purpose:

Unicode space-illustrating characters (visible)  

Code    Decimal  Name                  Block             Display   Entity  
U+00B7  183      Middle dot Basic      Latin             ·         ·        
U+237D  9085     Shouldered open box   Misc Technical    ⍽         -
U+2420  9248     Symbol for space      Control Pictures  ␠        -
U+2422  9250     Blank symbol          Control Pictures  ␢        -
U+2423  9251     Open box              Control Pictures   ␣        ␣

Jukka Korpela (author of "Unicode Explained") has a website which has this to say:

Visible spaces

There are some graphic characters that can be used a symbols for a space. Though sometimes called visible spaces, they are not spaces at all but visible notations used to indicate the appearance of spaces in instruction manuals and descriptions of texts.

The following table lists some symbols, in decreasing order by practical usefulness. Their shapes vary by font; especially the last one varies a lot.

 ␣   U+2423  OPEN BOX
␢   U+2422  BLANK SYMBOL

The symbol ␢ has a long history of use for this purpose in early computer programming. It was handwritten on coding sheets by programmers to indicate a space character to punch-card machine operators (who were like a typing pool).

I would use ␣ ␣ particularly as there is an HTML entity with such an obviously relevant name.

  • So if there are symbols for displaying space, are there symbols for displaying space symbols? – Shelvacu Mar 15 '16 at 2:56

You could always use a monospace font, then the space would be indicated by a char-sized gap :). You could highlight every space (eg <mark>&nbsp;</mark>), and set some CSS rules to make it the appropriate colour.


Look at the URL of this page. The spaces in-between the title's words are replaced by a dash. Its intuitive, readable and familiar.

  • 4
    Trouble is, the - will look just like a -! – wizzwizz4 Mar 13 '16 at 12:31

I am used to Eclipse's whitespace characters, which are used for showing whitespace in the context of code formatting.

  • Space: U+00B7 "middle dot": ·
  • Tab: U+2192 "rightwards arrow": →

If you can, displaying whitespace characters in a lighter color than regular text helps emphasize that these are whitespace characters. For example, if normal text is black, use gray.

  • The middle dot is the best solution for space, but for tab it takes more than one column on most monospaced fonts. I prefer the black right-pointing small triangle (U+25B8) which can be combined with the middle dot on vim to show tabs. – LawfulHacker Oct 3 '17 at 2:34

When I was learning technical writing at university here in New Zealand, we were taught to use a house (Unicode number: U+2302, HTML-code: &#8962) or an up-triangle (Unicode number: U+25B3, HTML-code: &#9651) to indicate spaces.


  • 12
    uhh... I have a really hard time to find the space in there. It looks too much like a character, so I have to read the word twice to even split the words at the right place... – Falco Mar 11 '16 at 10:47
  • @Falco, so do I. I guess it depends on the typeface chosen. – Greenstone Walker Mar 11 '16 at 20:20
  • 2
    I’ve seen that being used to display a column separator (or tabulator), but not for normal inter-word spaces. – Crissov Mar 12 '16 at 12:32

As mentioned above, the traditional programmer's blank is a lowercase letter b, overlayed by a forward slash. These were used on hand-written coding sheets passed from programmers to keypunch operators who were unfamiliar with the programming language being used and thus required unambiguous input.

On a web page, this can be represented by entering, in sequence: a lowercase letter b, a span tag that specifies a margin-left style of -.4em, a forward slash, an end span tag

(Using a CSS class would save typing and is usually better practice).

Using em as the measurement unit allows the character to scale if the font size is changed.


I'm not claiming this is superior, but it is an approach that can be used: for text that is to be displayed as characters (not an image) on a screen (not printed): just use the actual string, with spaces as required, and tell the user to position the cursor on the string and use an arrow key to move and count the spaces (I do this as a reader when checking some strings and counting lengths). This has the advantage that the string can be copied and pasted, and avoids any issues of character rendering and character set support.


Dates can be entered with multiple spaces, as in this example, which has 2 spaces between each element "25 Dec 2016". Put the cursor on the string and use the right and left arrow keys to explore it. You can copy this and paste it into the program.

(Note: this site replaces multiple spaces entered by a single one so, ironically, this example does not work here. I did enter 2 consecutive spaces where I said I did.)

Your Answer

By clicking "Post Your Answer", you agree to our terms of service, privacy policy and cookie policy

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