This A-Z list breaks down each tool within Sketch, including links to relevant tutorials here on Tuts+ and descriptions of what each tool can do. This list will be continually maintained and updated, so make sure you check back regularly!
#
9-Slice Image: Slice your bitmap images into nine different sections to aid scaling. You can click and drag any of the four points in the middle to adjust these sections. With this feature, your bitmap image will scale up the middle area proportionally, deforming the edges and corners as little as possible.
A
About Sketch (Sketch > About Sketch): A dialog window displaying your current Sketch version.
Align (Arrange > Align Objects): Also located on the Inspector panel. Align selected objects in a variety of ways.
Arrow Tool (Insert > Shape > Arrow): Use this when you need to create a line with a pointer at one end.
Artboard Tool (A) (Insert > Artboard): Click and drag inside Sketch’s canvas to create a new Artboard. Artboards are optional fixed frames within Sketch’s infinite canvas. You’ll find them especially useful for UI and web design when you need to limit your work area. Each artboard has its own rulers and grids.
B
Background Blur: One of the Blur options available via the Inspector Panel (for vector shapes). Pick a vector layer, check this option and it will blur all the contents behind the layer. In order for this to work effectively, you’ll need to adjust the opacity of the fill, not the layer opacity.
Background Color: Located on the Inspector Panel. Applies a background color to artboards.
Bitmap Editing: Although Sketch has little in the way of advanced bitmap editing tools, you can still perform some adjustments to pixellated content. Select an image on the canvas and double-click. You will notice the Inspector Panel update with a few special tools to perform different types of selections and actions.
Boolean Operations (Layer > Combine): You’ll find these located on the Toolbar, thought they aren’t visible by default. They present an easy way to combine shapes and create more complex paths. There are four types of boolean operations in Sketch, union, substract, intersect and difference. See their definitions for more details.
Blur: Select an object and hit the Blur option within the Inspector Panel. Choose between four different modes: Gaussian, Motion, Zoom and Background.
C
Canvas: The infinite workspace in Sketch. To center the canvas view hit Cmd-1. To zoom in or zoom out, hit Cmd-+ or Cmd-- respectively.
Close Path (Layer > Paths > Close Path): Sketch paths can be either closed or open, like any other vector editing program you may be familiar with. When a path is closed, the last anchor point in the path connects with the first. When it’s open, there’s a gap between the last point and the first. Be aware that any fills applied to an open path will be rendered as if the path was closed.
Color (Ctrl-C): The control panel to set your fill or stroke color properties. To make this visible, select a vector shape, enable the fill or border and click on the color swatch in either of them. You can also reveal the OS X color panel using the Color icon on the Toolbar (not visible by default). In Bitmap Editing Mode there’s another option named Color which fills the selected area with a chosen color.
Color Adjust: You can perform minor color adjustment tweaks when working with bitmap images in Sketch. Select an existing image on the canvas and use the Color Adjust Panel in the Inspector to do so. You can alter the Saturation, Brightness, and Contrast.
Combine Icon: All the Boolean Operations grouped into one single icon on the Toolbar (not visible by default).
Convert Text to Outlines (Shift-Cmd-O) (Type > Convert Text to Outline): This option converts the selected text layers into vector shapes. By doing this you can edit each path as you would any other shape. The same happens when using the Outline tool on the Toolbar (not visible by default).
Copy CSS Attributes (Edit > Copy CSS Attributes): Especially useful for web design, this option creates CSS declarations for borders, fills (also gradients), shadows and text styles used in the selected objects.
Crop Selection: In Bitmap Editing Mode, this removes portions of an image leaving only the selected area.
Customize Toolbar: To create your own custom toolbar right-click on the Toolbar and select this option. A new panel will appear where you can select which tools and options should be directly visible in your toolbar.
D
Difference (Alt-Cmd-X): One of the boolean operations available in Sketch. This is the inverse of an Intersect operation, showing only the are where two vector objects don’t overlap.
Distances: Get exact pixel measurements of distances between objects by holding down the the Option (⌥) key on the keyboard while keeping the objects selected.
Distribute (Arrange > Distribute Objects): You can also find this on the Inspector Panel. Distribute selected objects horizontally or vertically.
E
Edit Shape: Located on the Toolbar. Use the Edit tool to edit each of the anchor points on a shape. Alternatively, hit the Enter key while the shape is selected or double-click on it. In this way you can go through different options to edit the shape and limit the movement of the vector points using the available modes: Straight, Mirrored, Disconnected and Asymmetric. You can also round each point individually.
Export (File > Export): Also available via the Export icon on the Toolbar. Use this option to export your content to any of the available file formats: .png, .jpg, .tiff, .pdf, .eps and .svg.
Export Group Contents Only: This option is available on the Inspector Panel when you have selected a slice within a group. When checked, you will only export the layers within the group, discarding any overlapping layers outside it, or any layers behind it.
F
Fills: Sketch can fill shapes with a solid color, gradient, an image (pattern fill) or Noise. Located on the Inspector panel, you can add multiple fills to a single shape, each one with its own blending mode and opacity properties.
Find layer (Cmd + F): You can filter objects on the Layer list to find them easily. Go to Arrange > Find Layer and start typing to see how it works.
Flatten: Layer > Paths > Flatten. Also on the Toolbar. Merge a compound shape (as a result of multiple subpaths) into one single path. Use Flatten when you're happy with the appearance of your shape to keep it clean and remove any unnecessary vector point. But remember you will lost any subpath edit capability.
Flatten Selection to Bitmap: Layer > Flatten Selection to Bitmap. It works in a similar way like Flatten tool but this time, turning your content into a single bitmap layer. You can use it with one single object and multiple selections.
Flip: Layer > Transform > Flip Horizontal (and Vertical). Also right-clicking when hovering the object. Use this option to flip content right/left (mirror image) or vertically up/down.
Fonts: View > Show Fonts. Also in the Toolbar (icon not visible by default). Opens the OS X fonts panel where you can see what fonts are available on the system. Use it when you have text layers selected to change the font automatically.
Forward (Alt + Cmd + ↑) / Backward (Alt + Cmd + ↓): You can reorder layers on the Layer list by grabbing and moving it around with the mouse but you can use these options as an alternative. They're located on the Toolbar and the Arrange menu. Forward sends the currently selected layer one position further to the top. Backward sends the layer further to the background and moves it one position down on the Layer list.
G
Gaussian Blur: Apply this effect to blur an image with a Gaussian function. Located on the Inspector panel.
Gradient: Different gradient modes can be applied to fills and borders. To give a shape a gradient fill select it and click on the Fill button. At the top of the panel you can choose between a color, gradients, pattern or noise fill. The available gradients are linear, radial and angular. You will also have the option to edit gradients directly on the canvas, using the line with dots which appears over the shape.
Gradient Bar: Located on the Gradient Options Panel showing the gradient from left to right, with any additional stops in between.
Grid (Ctrl + G) (View > Show Grid): Also available on the Toolbar, this will show the default grid which has 20px squares and dividers (thick lines) every 10 squares. You can change its properties using Grid Settings option.
Grid Tool (Arrange > Make Grid): Also available on the Toolbar (not visible by default). Use this option when you have at least one object selected to create multiple copies across the canvas.
Group (Cmd + G) (Arrange > Group Layers): You can also group layers in your document using the Group icon on the Toolbar. Once you have created a group, double-click on it to view and edit its contents. The grouped content will also appear as one layer in the Layer List.
Guides: When resizing or moving layers Sketch will help you align them with other layers, automatically showing smart guides around your objects. Use Rulers to create custom fixed guides on the canvas.
H
Help: Access to Sketch’s documentation, Welcome Screen and Customer support.
Hide (Shift-Cmd-H): Also available via the Arrange menu, this option hides the current layer. It also works with multiple objects.
I
Image (Insert > Image): Also located on the Toolbar (not visible by default). Insert images into your Sketch document. If you import images while keeping an artboard selected your image will automatically become masked using the artboard dimensions.
Import: Sketch supports multiple formats for importing. Drag and drop files onto the Sketch icon in the dock, or directly into an open document. Supported files formats are: .png, .jpg, .tiff,.pdf, .eps and .svg. You can also open .psd and .ai files, but as flattened bitmaps.
Inner Shadows: Set Inner Shadows and set associated properties via the Inspector Panel to achieve a shadow effect within the selected object.
Insert: The first icon to be encountered on the Toolbar and arguably one of Sketch’s main menus. All the main tools for adding objects into the Canvas can be found here.
Inspector Panel (Alt-Cmd-2): This is the panel you'll find on the right side. It lets you adjust the settings for every aspect of your content: layers, artboards, export, tool options and much more.
Intersect (Alt-Cmd-I) (Layer > Combine > Intersect): Also available on the Toolbar. Intersects two vector shapes to create a vector comprising the areas where the original shapes overlapped.
Invert: In Bitmap Editing Mode, inverts the current selection. The area previously unselected will now be selected, and vice versa.
K
Keyboard Shortcuts: Visit Sketchshortcuts.com to get a quick reference of available keyboard shortcuts in Sketch and instructions explaining how to add custom shortcuts.
L
Layer list (Alt-Cmd-1): The Layer List located to the left contains a list of all layers (including slices and artboards) on the current page. It also shows a small preview for each item.
Layout Grid (Control-L) (View > Show Layout): Alternatively known as Layer Guides. Also available via the View icon on the Toolbar. Every artboard or page has its own layout grid which can be customized using the Layout Settings option.
Line tool (L): Creates a single stroke. Hold down Shift as you drag to constrain the angle.
Lock Layers (Shift-Cmd-L) (Arrange > Lock Layer): Extremely useful for avoiding mistakes and unexpected movements. Small padlock icons on the Layer List indicate which objects are locked.
M
Magic Wand: Available when editing bitmap layers. Use this tool to select similarly colored areas.
Make Exportable: Prepares the current layer or grouped layers for exporting.
Masks (Ctrl-Cmd-M): Used to show specific parts of other layers. For example, putting a rectangular mask on an image will only show the part within the rectangle. To create a mask, pick a shape and go to Layer > Use as Mask. From this moment any content above that mask are clipped to its boundaries. Put the mask and the layers you want to be clipped into a group if you don't want all subsequent objects to be clipped. Alternatively use the Ignore Underlying Mask option.
Mask With Selected Shape (Layer > Mask with selected shape): This automates the steps listed above. Pick two or more objects and hit the Mask icon on the Toolbar. A new group with all selected layers will be created using the bottom one as a mask.
Mask Mode: By default a mask shows specific parts of other layers. This is what we know as Outline Mask mode. However, you can tweak how masks reveal content by changing the mode to Alpha Mask (Layer > Mask Mode) and applying a gradient fill to the mask. In this case the gradient opacity dictates what is visible and what shouldn’t be.
Mirror: This connects to devices running Sketch Mirror. Mirror lets you preview your designs directly on connected iOS devices.
Motion Blur: Apply this effect to blur an image in one single direction.
N
Noise Fill: Fills the current layer with a grainy texture, giving a more realistic effect by adding a texturized style to the object. Sketch 3 comes with three additional noise effects: White, Black and Color.
O
Offset Pasted and Duplicated Objects (Sketch > Preferences > Layers): Turn this option on to offset duplicated objects from the original by 10px.
Oval Tool (O) (Insert > Shape > Oval): Use this to create ellipses on Sketch’s canvas. Hold down the Shift key while dragging to constrain movement and make a circle.
P
Pages: In addition to artboards Sketch supports multiple pages within the same .sketch file giving you multiple ways to manage and organize your content. You can add, remove or switch to other pages using the Pages section in the Layer List. Keep in mind that the Layer list only shows layers belonging to the current page.
Paste (Cmd-V): Paste contents from the clipboard onto Sketch’s canvas.
Paste in Place (Shift-Cmd-V): Use Paste in Place if you want to paste contents maintaining their original positions.
Pattern Fill: Fills the current shape using an image. You can choose between Tile (pattern) and Fill (stretched).
Pencil Tool (P) (Insert > Pencil): Sketch’s freeform vector drawing tool.
Pick Color (Ctrl-C) (Edit > Color Pick): Move cursor over the entire screen to pick up a color sample.
Pick Layer: Right-click on an object to take advantage of this option. Extremely useful when you have overlapping contents or grouped layers.
Plugins: Sketch supports custom plugins to expand its functionality. Use the Plugins menu to reveal all the installed plugins, to make your own custom plugin and to reveal the Plugins folder.
Polygon Tool (Insert > Shape > Polygon): Available on the Toolbar (not visible by default). Insert, by default, a pentagon onto the Canvas. Hold down the Shift key to constrain proportions. Use the Inspector panel to change the number of points and get a different polygonal shape.
Presentation Mode (Cmd-.) (View > Presentation Mode): Turn on full screen, hiding the inspector, toolbar and all other chrome.
Print: Sketch doesn’t support CMYK color mode, but you can still print your contents by going to File > Print. Note that only contents within artboards or Slices can be printed.
Q
Quit Sketch (Cmd-Q): Closes Sketch. A dialog will ask you to save your open documents.
R
Radius: Change the border radius of a rectangle or rounded rectangle shape by changing this on the Inspector Panel. Use the Corner property when you’re editing other vector shapes like Triangles or Polygons to achieve a similar effect.
Rectangle Tool (R) (Insert > Shape > Rectangle): Also available on the Toolbar (not visible by default). Select this tool then drag upon Sketch’s canvas to create a new rectangle. Hold down the Shift key to make a square.
Reflection: Creates a mirrored copy from the current object, placing it directly under the original. Use the Inspector Panel to alter its properties.
Rename / Rename Layer (Cmd-R): This changes the object’s (and therefore the layer’s) name. Also visible by right-clicking upon artboards.
Replace (Layer > Image > Replace): Changes the current image with a different one.
Reverse Order (Layer > Paths > Reverse Order): This switches the start point of a path with the end point, changing its direction. This can be useful when working with text on paths.
Revert to (File > Revert To): Sketch lets you dial your document back to previously saved versions.
Rotate Tool (Shift-Cmd-R): Also available on the Toolbar, use this tool to manually rotate selected layers. Note that every object will rotate relative to itself. Make a group to rotate multiple objects around a shared axis.
Rotate Copies (Layer > Paths > Rotate Copies): Also available on the Toolbar (not visible by default). This tool takes the current layer and rotates multiple copies of it around a certain point. All shapes will be added as subpaths to the original shape.
Rounded Rectangle Tool (U) (Insert > Shape > Rounded): Creates a rectangle with rounded corners. Change the radius via the Inspector Panel.
Round to Nearest Pixel Edge (Layer > Round to nearest pixel edge): This helps to get back your sharp edges while editing vector shapes if you suddenly notice that the edges are no longer pixel-perfect.
Rulers (Ctrl-R) (View > Show Rulers): Also on the Toolbar under View icon. Click on the ruler to add manual guides. You can move the Rulers by dragging and moving them around. You can also move your own guides in a similar way. To remove guides, drag them out of the view and you’ll see they disappear.
S
Save as Template (File > Save as Template): Save your current document as a template. To use it on a new document you can choose it from File > New from Template.
Scale Tool (Edit > Scale): Available on the Toolbar. Use this tool to proportionally scale the selected objects . You can set the height, width or the scale factor.
Scissors Tool (Layer > Paths > Scissors): Select an existing shape and select the Scissors icon on the Toolbar (not visible by default). Click on a path section in your vector shape to cut it away.
Shadows: Located on the Inspector Panel, use this to create a new shadow effect under the selected object. You can set its color, position and spread. Remember, you can apply multiple shadows to a single object, but be careful and keep an eye on Sketch’s rendering performance.
Shared Style: Select a single object then click the No shared style option on the Inspector panel. Now click on Create New Shared Style. Now you will have access to a new shared style. Use it on every object in your document to share fills, borders and special effects. Every change you make to one Shared Style is immediately reflected on all the others linked objects. Shared Styles works similarly to Text Styles and Symbols and they’re available through all pages in your document.
If you don’t want to apply a shared style but still want to replicate the same effects, you can make use of the Copy Style option by going to Edit > Copy Style. Paste it on the object you want through Edit > Paste Style.
Show Artboard Preview (View > Show Artboard Preview): Lets you preview your current artboard in a separate window.
Show Pixels (Ctrl-P) (View > Show Pixels): Turn this on to reveal the Pixel Grid. You'll see it when you zoom in.
Slice Tool (S) (Insert > Slice): Also available on the Toolbar (not visible by default). A Slice is a special layer which allows you to export a defined area on the canvas to a single file.
Special Characters (Ctrl-Cmd-Space) (Edit > Special Characters): Opens the OS X special characters dialog.
Spelling: Gives access to the spelling and grammar tools from OS X.
Star Tool (Insert > Shapes > Star): Also available on the Toolbar (not visible by default). Adds a star vector shape to your document. You can set the amount of points and radius using the sliders in the Inspector Panel.
Strip Text Style (Sketch > Preferences > Layers): When turned on, Sketch removes all font, paragraph and color information from text you paste in from other sources like web browsers or text editors.
Stroke Width (Layer > Paths > Stroke Width): The Stroke Width Tool allows you to set different widths to your borders by setting width points. You can drag these points out from the border to make the width larger or smaller.
Styled Text (Insert > Styled text): Inserts a new Text Layer based on one of the Text Styles available in your document.
Subpath: A subpath is one single part of a more complex shape. Generally, you will see the term Subpath when reading about Boolean operations and compound vector shapes in Sketch.
Substract (Alt-Cmd-S) (Layer > Combine > Substract): Also available on the Toolbar. Select two vector shapes and hit the Substract icon on the Toolbar. The result will be a vector where the area of the top shape is removed from the one under it.
Symbols: Groups of reusable content across pages and artboards in your document. Create a new Symbol by hitting the Create Symbol icon on the Toolbar while an object is selected, or through Layer > Create Symbol. Symbols are displayed as a group in the Layer List, but with a purple folder icon instead of a blue one. A Symbols icon is available in the Toolbar (not visible by default) to get direct access to them.
If you create a lot of symbols in your document you may want to organize them. Go to Insert > Symbol > Manage Symbols to do so.
T
Templates: There are a few iOS and web design templates, with symbols and styles, which come with Sketch by default. Remember you can create your own custom templates by saving your documents using the Save as Template option located in the File menu.
Text tool (T) (Insert > Text): Also available on the Toolbar. Adds a Text Layer to the canvas. Use the Text Inspector options or Type menu to set its properties.
Text on Path (Type > Text on path): Turn this on then move a text layer over a vector shape to see how it adapts to the path. The text layer has to be above the vector shape on the Layer List to make it work.
Text Styles: These works similarly to Shared Styles. See their definition to find out more.
Toolbar (Alt-Cmd-T): The Toolbar contains all the main tools you will need to make your documents come to life. Customize it by right-clicking and choosing Customize Toolbar.
Transform Tool (Cmd-Shift-T) (Layer > Transform > Transform Layer): Alternatively, click the Transform icon in the Toolbar then distort the shape by moving the dots in the middle and corner areas. The Transform tool can be used with multiple layers at the same time.
Triangle Tool (Insert > Shape > Triangle): Also in the Toolbar (direct access not visible by default) this adds a triangular vector shape to the canvas. Hold down the Shift key when dragging to constrain proportions.
Trim Transparent Pixels: Turn this option on if you need your exported files to have transparent pixels trimmed away from the edges.
U
Union (Alt-Cmd-U) (Layer > Combine > Union): Also on the Toolbar. Use this while keeping two vector shapes selected to get a vector built as the sum of both.
Ungroup (Shift-Cmd-G) (Arrange > Ungroup Layers): Also on the Toolbar (not visible by default). Split the current group into separated layers.
V
Vectorize: In Bitmap Editing Mode, it turns the current selection into its own shape layer. The original image remains untouched.
Vectorize Stroke (Layer > Paths > Vectorize Stroke): Also available on the Toolbar (not visible by default). Expands the border of the selected shape, creating a solid outline.
Vector Point Tool (V) (Insert > Vector): Also available on the Toolbar. Instead of using regular shapes, you can use the Vector tool to draw a vector shape from scratch.
W
Welcome Screen: Shows you interesting links to templates, support and other resources related to Sketch. You can access it again through the Help menu.
Z
Zoom In (Cmd-+) and Zoom Out (Cmd--): For zooming in and out of the document. Also available via the View menu and the Toolbar (magnify glass icon). You can make a Zoom Selection using Cmd-2.
Zoom Blur: Apply this effect to add a zoom blurred effect. Located on the Inspector Panel.
Now You Know Your ABCs
The above list gives a taste of what Sketch has to offer for creating brilliant interfaces and graphics. You can learn more about Sketch by following the regular tutorials here on Tuts+.
