Blinkie, button and stamp sizes
The little graphics of the old web come in a few fixed sizes, so that they line up on a page. Here they are, each at its real size, with what it is for.
A few blinking words: under your name, in a row, or on a whole wall of things you love.
The classic web button, around since the nineties: it links to a website. A wall of them shows the sites and friends you like.
An even smaller button, sometimes called an antipixel button: room for one short word.
A little picture with a few words that says what you love or who you are - the size made popular on deviantArt.
The classic full banner: big words, or a picture, across the top of a page.
Twice as big stays sharp
Too small on a big screen? Show it exactly two, three or four times as big, and every pixel stays a sharp little square. The same button at its own size and twice as big:
88 × 31, and 176 × 62: twice the width and twice the height.
<img src="button.gif" width="176" height="62" style="image-rendering: pixelated" alt="My button">At one and a half times, or at a width that is just a little off, it gets blurry or uneven. More about that in how to show a small GIF bigger without blurring it.
Where to make them
- The Blinkie Studio makes blinkies (150 × 20), buttons (88 × 31), stamps (99 × 56) and banners (468 × 60), and downloads them at their own size or two, three or four times as big. The size buttons above the picture switch between them.
- The Glitter Editor has Blinkie 150×20 and Button 88×31 among its canvas sizes, under Select: a name on a picture, at that size.
- Neither makes 80 × 15 buttons, but Glitter Graphics has some, like the zodiac signs among the stickers.
Keep the numbers. In the code, give a graphic the width and height of its file, or exactly twice:
a blinkie of 150 × 20 with width="140" gets squeezed and blurry.
Make one in the Blinkie Studio or read how to make a button
Good to know next
How to make an 88x31 button or a stampYour own 88x31 button or 99x56 stamp, and a button that links to your site.
How to show a small GIF bigger without blurring itOne line of CSS keeps a blinkie crisp at twice or three times its size.How to add blinkies to your Neocities pageCopy the code or upload the GIF, a wall of blinkies, and a blinkie of your own.