34

I know we can use <kbd> to make keyboard short cuts like this ! For example, if I wanted to explain how to open the Run prompt on Windows, which is the Windows key and R, how would this be done? (And for clarity, I mean the Windows key which is typically between ctrl and alt)?

2
  • 4
    If typing ctrl and alt isn't a problem, why is Win or Windows? It's not printed on the key, but just as clear. How about shift or tab? backspace? return? left arrow? Commented Dec 19, 2012 at 16:26
  • 6
    Because typing a key with Ctrl exists on my keyboard... But a key with win doesn't. Why else would I ask? :) please don't read my comment as rude, it is not meant to be :) Commented Dec 19, 2012 at 21:05

2 Answers 2

51

Joey has this trick of embedding the Windows logo image within the kbd tags. So

<kbd>![Windows Key][winlogo]</kbd>

Combined with a regular key, looks like:

Windows KeyR

Here's a better one that shows the 4 parts clearly:

Windows KeyR <kbd>![Windows Key][newwinlogo]</kbd>

Although FWIW I like the old one much better:

Windows KeyR <kbd>![Windows Key][oldwinlogo]</kbd>

Here are the images you have to use in your post's source code:

[winlogo]: https://i.sstatic.net/Rfuw7.png
[newwinlogo]: https://i.sstatic.net/B8Zit.png
[oldwinlogo]: https://i.sstatic.net/T0oPO.png
6
  • Err, "I like the old one much better" refers to me, not Sathya (although of course he may share my views!) Commented Dec 21, 2012 at 3:41
  • 2
    The only issue with the huge icon is that you can't really use it in a paragraph (because it'll increase the line height) or with other keys because it's too large. Commented Dec 21, 2012 at 17:49
  • 1
    @Karan indeed, I do! Commented Dec 22, 2012 at 6:13
  • @slhck: 16x16 vs 12x12, so I guess it might be possible to shrink it without losing too much detail (then again, maybe it'll end up looking just like the one Joey uses). Commented Dec 23, 2012 at 6:57
  • 1
    Hmmm, not too nice on mobile (or at least on some devices), nor for the few who have Imgur blocked at work. Commented May 19, 2013 at 14:52
  • 1
    Can someone please cleanup the excess white on [newwinlogo] Commented Oct 20, 2016 at 19:25
12

Well, you could use a symbol that closely resembles a window, which is SQUARED PLUS, or Unicode: U+229E. It looks like this:

If it doesn't look like the Windows logo to you, you can also simply use ⊞ Win, Win, Windows or Windows-Key. The benefit here is that everyone will know what you mean.

3
  • 2
    I call it the super key to be linux friendly. Commented Dec 19, 2012 at 19:58
  • Thanks. I had no problem typing windows but no key actually has the string "windows" and I was just curious. There isn't a key, but we don't care! :) Commented Dec 19, 2012 at 21:04
  • @DaveRook well Windows key don't have a string but you still call it Windows/Win key. ;) Commented Dec 20, 2012 at 9:36

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.