How to make your own icon set

Printer Friendly Version Attach Files

09 Jul 2010 04:33. Edited 7 times. (Edit, Permalink)

This document has been moved to the documentation category: Icon sets.

Included page "inc:signature" does not exist (create it now)


02 May 2011 13:43. Edited 0 times. (Edit, Permalink)
I just posted this on Twitter, but for anyone that doesn't follow me on there:

Very soon I will be introducing a new way to install icon packs - the first part of this change is compiling all of the button icons into a single file to make it easier to manage. You can see an example here:

Also, notice the paperclip/link button. This will be used for creating a triple-bracket link in the editor (this supports both relative and absolute URLs). It might be implemented in the next version or it might not be - but either way, it'll be added soon and therefore I'm letting you know that an icon is needed for it.

Creating your own icon pack

  1. Download the example above
  2. Replace the images there with your own

It's that simple!

Things to note:

  • Each 22x22 pixel square in the image is a separate button
  • The position is important. Where you see the "Bold" button on that image is where I'll look for it on your image.
  • I'm planning to force a minimum size of 176x176 (enough for 8x8 row of icons) … but there will be no maximum size restriction. This allows you to expand it either downwards or to the right, and add a logo or other information to the image as well.

Menu icons will also be configurable, and will be controlled the same way, but in a separate image:

  • 16x16 icons instead
  • Therefore, an 8x8 grid results in a minimum size of 128x128. No maximum size restriction.
  • I'll let you know position of each icon soon, so that you can start working on it.

What you'll end up with:

  • Zip file: name of the archive is the name of your icon pack
  • Inside the zip:
    • toolbar.png - minimum 176x176 (22x22) for toolbar icons
    • menu.png - minimum 128x128 (16x16) for menu icons

PNG format is the only image format that will be accepted. This allows you to add transparency, e.g. for circle toolbar buttons you might want to make the corners of each 22x22 grid be transparent.


Users will be able to install your texture pack themselves - unlike how it is now, with me adding them to STE manually. Not sure on the exact details just yet.

Included page "inc:signature" does not exist (create it now)

Post Reply

Add reply on "How to make your own icon set"

Printer Friendly Version Attach Files

CSS Theme, Images and Code on this website are © Shane Smith 2010-2012. All forum posts by users and documentation licensed under Creative Commons BY-NC-SA 3.0 License.