Introducing Tints

Tints are a new way to apply a color to Symbols and groups, without relying on complex workarounds or multiple styles. When you apply a Tint, the new color affects everything, including borders and areas with different fill opacities. Tints work great with Library or document colors, and they’re easy to override, making them perfect for things like icons with multiple states or items in a tab bar.

Tints really come into their own when you consider the example above — a set of semi-filled icons. In the past, you’d need to define a few different overrides or create masks to change their color. Or create copies of your icons with different colors to swap between. Now, you can simply create base icons in black and white, then add a Tint. You’ll see the option to add a Tint in the Inspector whenever you’ve selected a group or a Symbol instance.

Tints also work great with things like selection states in a tab bar. These are a little more complex, because they combine icons and text. Previously that would mean overriding text styles for the label, and layer styles for the different parts of each icon. But with Tints, you can do everything with just one override.

To set up Tints as overrides like we have here, you head to the Symbol master, select the different nested Symbol instances, and apply a default Tint. When you insert an instance of your Tab bar symbol, you’ll see the option to apply a Tint next to each nested Symbol override in the Inspector. You’ll find more details about this in the Tints documentation.

You can get started with Tints in version 64 of the Mac app today. We’ve got some exciting ideas on how we can expand on Tints in the future and we can’t wait to share them with you.

A new Components Menu

In November 2019, we launched the new Components Panel and Popover with Sketch 60. Since then, we’ve listened carefully to your feedback — good and bad — and today we’re introducing some improvements and changes. As Chris Downer, our Mac Product Owner, explains:

We realize the changes we introduced with Sketch 60, and the updates we had planned, didn’t meet everybody’s needs and negatively impacted some folks’ workflows.

We are thankful for everyone’s comments and feedback we’ve received — as well as the time given by participants in our research sessions — and we’ve changed our approach as a result.

With Sketch 64, we’ve taken on your feedback and built the new Components Menu for speed. It combines the familiar fly-out menus that many of you were missing (and felt you could navigate through fast) with an even more powerful search and filtering function.

The search bar now sits at the top of the Components Panel, Components Menu and Layer List — and, importantly, it now supports fuzzy search. You don’t need to know the whole name of the Component you’re looking and type it exactly. Just type what you know and we’ll handle the rest. We’ve also redesigned the search results to make it clearer and faster to navigate.

For those of you who you know exactly how your Library is organised, we’ve brought back the fly-out menus to help you quickly navigate to the exact Component you need. We’ve also kept quick access to Components in the same group, so swapping out a similar Symbol stays easy.

Updates, improvements and fixes

This latest Mac release also includes a number of smaller updates, improvements and fixes, incuding:

• A new set of shortcuts for Symbols — now you can use Cmd + Y to create a Symbol, Cmd + Shift + Y to detach from Symbol, and Cmd + Option + Shift + Y to detach all content from Symbol.
• Updated Artboard presets for Chromebooks — we’re now featuring the Pixel Slate (1333 x 888) and Pixelbook (1200 x 800).
• Performance improvements — if you’re working on a document with lots of Symbols or you’re using Smart Layout, things should feel a little faster and more responsive.
• Crash and bug fixes — if you were missing the List Options… menu item in the Text menu or having trouble with text colors unexpectedly changing, this release has you covered.
• As we mentioned last month, this version of the Mac app requires macOS 10.14.4 or above. By increasing our minimum system requirements, we can take better advantage of modern macOS technologies to make Sketch faster and more reliable. 🚀

Version 64 of the Mac app is available as an update right now — you can read a full set of release notes at sketch.com/updates.

Better layer selection in Cloud Inspector

Now, when you’re using Cloud Inspector, you can right-click over the layer you want to select and choose it from the contextual menu that appears. This layer selection menu is similar to the one you’ll find in the Mac app and it’s ideal where overlapping layers make it tricky to select exactly what you need. It’s also great for selecting two overlapping layers to measure between.

We’re hard at work on some big updates and improvements to Cloud Inspector which we’re excited to share soon, but for now we wanted to share a small update we’ve shipped that makes selecting overlapping layers easier.

We hope you’ll enjoy these latest updates to Sketch. We’re always listening to your feedback, so if you have any questions or run into any issues, please get in touch and let us know.