This design guideline is intended to help you maintain consistency with other user interface elements within Pentaho Data Integration. It's recommended that you create your icon in vector shapes using a design tool which saves or exports to Scalable Vector Graphics (SVG) Version 1.1 format. Vector shapes allow assets to be scaled up without loss of detail and crisp edges.
The anatomy of a PDI icon
This section reviews the breakdown of what goes inside the icons.
|1: Icon fill color
|The primary stroke color is #3D6380
|2: Icon border color
|The primary stroke is 1.7pt
|3: Icon foreground line color
|The secondary stroke size is 0.8pt
Positioning action indicators
|1: Action indicator
|For any PDI icon which requires an action indicator, the icon must have the secondary element placed in the top-left or bottom-right corner of the icon.
|2: Forty-five degree slice for positioning action indicators
|The primary element within the icon is recommended to have a 45º angle sliced through, and the secondary element placed in that spot.
Action indicator badges
|Input / Import /
Get / Download / Extract / Read
|Output / Upload /
Export / Insert /
Put / Write
|Execute / Call
|Search / Lookup / Exists