X to Close

The origins of the use of [x] in UI design.

Lauren Archer
Feb 10, 2014 · 8 min read

X’s are everywhere in user interface (UI) design. A powerful symbol, [x] is capable of closing windows and popups, toolbars and tabs and anything else that might otherwise be cluttering up your screen.

Twitter X

Clicking on [x] to close a feature has become an instinctual part of using a computer and a standard in web and software design. Although it may seem like the ubiquitous [x] has always been a part of Graphical User Interfaces (GUI), a quick jaunt through the history of GUIs reveals that this actually isn’t the case.

So where and when did the [x] first enter into the UI lexicon?

Chrome X

To track the [x] back to its origin, let’s start with the status quo: Microsoft.

If you are using Windows then you should be able to spot at least one [x] on your screen right now.

Windows 7 X

But didn’t use an [x] to close.

Windows 1.0

Windows 2.0

Windows 3.0

The [x] button didn’t show up until , when the close button was moved to the right hand side, joining minimize and maximize.

Windows 95

There is even evidence that this was a late addition to Windows 95. In this early demo (Codename: Chicago), the minimize and maximize buttons have been redesigned, but the close button remains the same, and to the left as before.

Windows Chicago
August 1993

So, who was responsible for this last minute change? As far as I can tell, this person is responsible for the proliferation and widespread use of [x] in UI design today.

The intent of Windows 95 was always to get a computer on every desk and in every home. Design changes from Windows 3.0 were made specifically in response to usability feedback. The goal was to ensure that any computer novice would be able to learn Windows 95.

It worked.

Windows 95 eliminated all other OS competition, and was adopted by businesses and for home use worldwide.

But our goal today isn’t to pinpoint when the [x] became popular, but rather to find out when it first entered into UI design.

Can we find an earlier example of [x] in a GUI?

didn’t use an [x] to close. Only in OS X did an [x] first appear, and then only when you hover over the red close button.

Mac OS 2: Pretty Colours!

And started to use the [x] symbol only after the release of Windows 95.

X Window System

We aren’t getting very far this way, so let’s go back to the very beginning. Back before Windows or Linux or Mac OS. Back to the very first GUI to fully utilize the that we are all so familiar with: The 8010 Information System from Xerox.

Xerox 8108

Also known as “The Xerox Star”, “ViewPoint”, or “GlobalView”, Xerox started the development of the 8101 in 1977 and first sold the system in 1981 as “Dandelion”. This is the GUI that Apple allegedly modeled their Lisa/Mac OS after, inspired by a tour of the Xerox headquarters in December 1979.

No [x], though:

Xerox Star

Recall that no [x] appears in early Apple operating systems either:

Mac OS 1

There is no [x] to be found in the, the first integrated graphical software environment for IBM PCs, released in 1983:

Visi On

The, developed by Digital Research for and DOS-based computers in 1984, didn’t have an [x]:

GEM

But! What is this? Could it be?

Atari TOS 1.0

This is a screenshot of . Built on top of GEM to be ported to the Atari ST in 1985, from the computers division of Atari Corp. It is the earliest example of the [x] button I’ve been able to find.

So why here? Why now?

This may be another example of Atari, an American company, borrowing from Japanese culture. The first example, of course, being the name Atari itself, a Japanese term from the game Go that means “to hit the target”.

The use of [x] for close and [o] for open could come from the Japanese symbols batsu and maru.

Maru (o) and Batsu (x)

Batsu (x) is the symbol for incorrect, and can represent false, bad, wrong or attack, while maru (o) means correct, true, good, whole, or something precious. Batsu and maru are also common hand gestures. Cross your arms over your chest for batsu, circle your arms over your head for maru.

Playstation Controller

Another familiar example of batsu/maru is in the Playstation controller design, where maru and batsu are used for yes and no.

This is just a theory, however. Not being there myself at the time, I can’t be sure.

For the sake of being thorough let’s see if we can go back any further.

The first line-based text editor was Quick Editor or , written by Ken Thompson in 1965, who later helped to develop Unix. Qed uses [q] for the quit command.

Early text editors used a bunch of different escape commands: [q], [e], [c], and [ESC], but [x] was never a popular option. , em and , early text editors spawned from qed around 1971, didn’t use [x.]

, , or ?

No [x] to close these 1980's text editors either. X was commonly used to delete characters in-line, but not to close the program.

[x] is a true icon, not representing a letter but representing an action, and only adopted to represent ‘close’ well after the development of graphics-oriented operating systems. The first appearance of [x] in GUI design was likely the Atari TOS, possibly influenced by the Japanese batsu and maru conventions. Thanks to a last minute design change in Windows 95, and the mass adoption of Windows worldwide, [x] has become the standard symbol for ‘close’, a symbol that dominates web, app and software design today.

That’s all for now.

[x]

Screenshots from and

UPDATE:

So this little article has travelled pretty far! There were into the origin of [x] but none as good as this email that I received from Windows 95 team member Daniel Oran.

“Hi Lauren,

A friend forwarded me your Medium piece, “X to Close.” He remembered that I had worked on Windows 95 at Microsoft — I the Start Button and Taskbar — and thought I’d be amused. I was! :-)

It’s fun to see how history gets written when you actually lived those long-ago events. I joined Microsoft in 1992 as a program manager for the user interface of “Chicago,” which was the code name for what eventually became Windows 95.

So, who was responsible for this last minute change? As far as I can tell, this person is responsible for the proliferation and widespread use of [x] in UI design today.

It wasn’t a last-minute change. During 1993, we considered many variations of the close-button design. And the source wasn’t Atari. It was , which had an X close button in the upper right, along with the grayscale faux-3D look that we borrowed for Windows 95.

I wanted to put the Windows X close button in the upper left, but that conflicted with the existing Windows Alt-spacebar menu and also a new program icon, which we borrowed from2, on which Microsoft had originally partnered with IBM.

Attached is the earliest Chicago bitmap I could find that includes an X close button. It’s dated 9/22/1993. (In attaching the file to this email, I just realized that it’s so old that it has only an eight-character name. Before Windows 95, that was the limit.)

Thanks for your very entertaining essay!

Best,

Danny”

Windows Chicago 9/22/1993.

I guess you could say case [x]ed.

eXT 1988

Fascinating!

This story was originally published by Lauren Archer on February 10, and was added to the re:form collection today because we loved Lauren’s smart take on UI design.

You can follow Lauren Archer on Twitter at @. Subscribe to re:form’s , sign up to receive our stories , and follow the main page .


re:form

A field guide to the designed world

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store