Create your icon pack
You must own the rights to all images included in your icon pack. To get started you can create the folder structure found in the Template or use the IconPackMan tool.
Template
The template demonstrates how to use the icon pack folder structure and each of the possible file types (svg
, png
, jpg
, webp
, and gif
.) You can download the template below:
IconPackMan
The IconPackMan
tool allows you to create your icon pack by dragging your icons into the app. You can then export the compiled .streamDeckIconPack
, which you can then share and distribute on the Elgato Marketplace. You can view to Read Me from within the app to help you get started. You can find IconPackMan
here.
Files overview
Here's an overview of the required files and their purpose:
File | Type | Required | Description |
---|---|---|---|
manifest.json | json | yes | icon pack info like name, author, version, … |
icons | folder | yes | Folder containing the svg icons |
icons.json | json | yes | Description and tags for each icon |
icon.svg | image | yes | Icon to visually identify your icon pack in Stream Deck. (png or jpg are allowed) |
license.txt | text | no | License to end-users for the use of your icons |
previews | folder | yes | Folder containing preview images for the store |
manifest.json
Example:
{
"Name": "My awesome icon pack",
"Version": "1.0.0",
"Description": "Put your description here. It gets shown in the icon pack store.",
"Author": "Famous Icon Creator",
"URL": "https://www.elgato.com",
"Icon": "icon.svg",
"License": "license.txt"
}
Members:
Member | Required | Description |
---|---|---|
Author | yes | Name of the author visible in Stream Deck. |
Name | yes | Name of the icon pack visible in Stream Deck. |
Description | no | Describe your icons here. If your icon pack makes it into the Marketplace, this description will be shown to the user. |
Version | yes | Version of the icon pack that can only contain digits and periods. This is used in case you want to provide updates to the icon pack. In this case, we recommend following the semantic versioning specification. |
Icon | yes | Relative path to an icon/image. This small icon is shown next to the icon pack's name. See section icon. |
URL | no | A URL to get more info about the icon pack. |
License | no | Relative path to a txt file containing a license. See license.txt. |
icons
The folder icons
contains icons in the supported formats listed below. An icon should have a size of 144 x 144 px (or a multiple as e.g. 288 x 288 px) for best results.
File Formats
- svg
- png
- jpg
- gif
- webp
Animated icons require an additional preview PNG file (with the same name) alongside the original file in the icons
folder. The PNG file does NOT need an entry in the icons.json
file.
File | Type | Description |
---|---|---|
icon.gif | image | Animated icon is shown on Stream Deck |
icon.png | image | PNG is shown in Image Library |
icons.json
The icons.json
file contains metadata for each icon in the icons
folder.
Example:
[
{ "path": "icon_1.svg", "name": "Train", "tags": ["travel"] },
{ "path": "icon_2.svg", "name": "Salad", "tags": ["food"] },
{ "path": "icon_3.svg", "name": "Bike", "tags": ["travel", "sport"] },
...
]
Members:
Member | Description |
---|---|
path | Filename of the icon inside the icons folder |
name | Name of the icon which is shown to the user |
tags | Tags used to categorize/search individual icons |
icon [svg png jpg]
The icon [.svg | .png | .jpg]
image serves as icon to visually identify your icon pack in the list of shown icon packs:
For a crisp icon representation in the Image Library ('Stream Deck style') you could use these specifications:
Specification | Value |
---|---|
Color | #C8C8C8 / rgb(200,200,200) |
Size | 56 x 56 px |
You can use any other size (but keep in mind, the icon will get scaled in this case, which might result in some blurring - except if you use svg
)
license.txt
You can add a license file to the structure as a text file. This license can be read by the end-user in the Stream Deck application.
Testing
You can test your icon pack by following these steps:
- Quit the Stream Deck application
- Copy your icon pack folder like
com.elgato.hello.sdIconPack
into the folder~/Library/Application Support/com.elgato.StreamDeck/Icons/
on macOS or%appdata%\Elgato\StreamDeck\Plugins\com.elgato.StreamDeck\Icons\
on Windows. - Launch the Stream Deck application. Your icon pack should be visible in the Image Library. If it doesn't appear, please drag it to the
IconPackMan
window, which will help you to identify the issue.
Preview Images
The Elgato Marketplace displays preview images for your icon pack. These images can include the user interface, helpful infographics, or marketing materials.
Requirements
- Quantity: 1-3 images named sequentially (1-preview.png, 2-preview.png, etc.)
- Size: 1920 x 960 px
- Format: PNG
- Content: Non-transparent
Adding previews
You can include up to 10 preview images for your icon pack. If you want to add more preview images, you can email them to maker@elgato.com.