Data
With the Data tool , you can add different images and text to your designs to create realistic mockups and prototypes.
There are a number of Data sources included in Sketch by default, split into two types:
- Text Data: real names and cities.
- Image Data: a diverse set of user photos for avatars, and tiles (for patterns).
You can take things further with more complex Data sources using third-party Data plugins. By default, we’ve pre-installed the Unsplash plugin, which allows you to search for and insert an image from the Unsplash library, or insert a random image.
Working with Data
Select the shape or text layer you want to add Data to, click on the Data button in the toolbar, or choose Layer > Data, and select the type of Data you want to insert.
How to Refresh and Clear Data
Press ⌘ + ⇧ + D or choose Refresh Data from the Data menu to fill your layer with different images or text from your Data source.
To remove the connection between your Data source and a layer, click Disconnect from Data Source in the Data menu.
Note: Disconnecting from a Data source won’t restore your layer’s original contents.
How to Use Data with Symbols
You can add multiple Data sources to different layers within a Symbol and refresh them all at the same time.
You can also add or refresh Data within a Symbol using the Data icon next to each Symbol override.
Adding New Data Sources
You can create your own Data sources and add them to the Data tab in Preferences.
Tip: Make sure to save your Data sources in a place that won’t change. If you move the location of your Data sources after you’ve added them, Sketch will not be able to find them.
Creating a Text Data Source
To create your own text Data source, create a plain text (.txt) file with each data value on a new line:
Afghanistan
Albania
Algeria
Andorra
Angola
...
Creating an Image Data Source
For a new image Data source, all you need to do is create a folder with all the different images you want to use inside and add it via the Data tab in Preferences.
Data Plugins
You can install Data Plugins just like regular plugins and they’ll open up a whole new range of data sources for you to use.
If you’re interested in creating a Data plugin, check out this handy guide, and our developer documentation.