Share styles with your team using Google Sheets.
Install from Sketch Toolbox (recommended) or download the zip, unzip, and open sync.sketchplugin
.
You'll need a published sheet to use Sync.
Create a Google Sheet from this template (click the "Use this template" button).
Select File > Publish to web… and then click the Publish button.
Export styles from Sketch to your sheet. Alternatively, you can skip this step and define your initial styles in the Google Sheets interface.
typography.csv
.typography.csv
into the upload screen and select Replace current sheet then click Import.Import styles from your sheet to Sketch.
Copy the URL to your Google Sheet. (See below if you are using Google Apps at work)
Run the Import
command from the Sync plugin menu and paste your URL into the prompt.
Your text styles, layer styles, and color palette should now be synced with your spreadsheet. Run the plugin again any time to update. Share your published sheet URL with your team to stay in sync.
Some companies prevent employees from publishing sheets. If the Published content & settings drill-down in the Publish to the web modal says that people at your company must log in to view, then Sync will not be able to access your sheet. Don't worry – you can still use Sync for typography. Just visit Sheetsu to generate an API for your new sheet. Use your new Sheetsu URL and continue to step 2.
Font variants—such as bold, italic, or narrow—are actually separate font files on your computer. You should specify these exactly as named in ~/Library/Fonts/
folder on your Mac, excluding the file extension (e.g. ttf
). The Google Sheet template provides an example of this. If you get stuck, consider defining your styles in Sketch and using the export feature.
View the screencast, create an issue or tweet @stan.
Share your pattern library with the Sync community.
As an alternative to Google Sheets, you can create a custom JSON api with the following structure. Currently this method only supports typography.
{
…
result: [
{
Style: "Headline 1",
Size: "32",
Color: "DD2E1F",
Opacity: "85",
Typeface: "SourceSansPro-Semibold",
Alignment: "center",
Line: "40",
Character: "0"
},
…
]
}
Run the Import command from the Sync plugin menu and paste your API endpoint URL into the prompt.