0
100
200
300
400
500
600
700
800
900
1000
1100
0
100
200
300
400
500
600
700
800
900
1000
1100
Figma plugin#11 in Typography

Fix San Francisco

Easily apply the correct tracking based on font size for SF Pro and New York texts!

by Charlie Chao

users
15K
likes
209
saves
11K
comments
7
FreeWorks inFigma Design
Price
Free
Latest version
v8 · Feb 28, 2024
First published
Aug 10, 2019
Publisher
Charlie Chao
On this page
Overview

About Fix San Francisco

Fix San Francisco is a free Figma plugin published by Charlie Chao in 2019. It works in Figma Design and has 14,959 users and 209 likes on the Figma Community. It ranks #11 in Typography on our lists.

In the developer's words

This plugin won't fix the city's problems, but it will automatically apply the correct font variant and tracking for selected texts using the San Francisco typeface.

How to Use

  1. Select a Frame or texts with “SF Pro”, “SF Pro Display”, “SF Pro Text”, "SF Pro Rounded", or "New York" fonts.
  2. Run “Fix San Francisco” from Plugins menu.

The plugin will find all relevant texts in your selections and apply the fix.

Note: Texts with text style will not be changed.

Note: For New York, you must use the “New York” font and not the optical variants (“New York Small”, “New York Medium”, etc.) for the plugin to apply the appropriate tracking.

Context

When texts with SF fonts are rendered on iOS, their variant and tracking (letter spacing) are adjusted based on their point size and the user's accessibility settings. In Figma, the tracking must be manually applied to get a more accurate representation. Hence, Fix San Francisco is here to automate this process for you ♥

Inspired by Sketch-SF-UI-Font-Fixer.

Changelog

What's new

Version 8 · released Feb 28, 2024

  • Added support for dynamic page loading.
Trust

Permissions and privacy

Network access

Fix San Francisco declares no network access, so it runs entirely inside Figma and can't send your file anywhere.

Extra permissions

None beyond the standard access to the file you run it in.

Read from the plugin's published manifest. Questions about data handling go to the developer's support page.

Rankings

Where Fix San Francisco ranks

Compare

Fix San Francisco alternatives

  1. 152K users445Free + paid features

    Replace fonts through all pages and artboards

  2. 2

    Typescale

    by Sam Smith

    116K users1.6KFree

    Harmonious typographic scales

  3. 3

    Type Tool

    by Space Ursa Design

    96K users1KFree

    Advanced text transformations directly in Figma.

  4. 4

    Font Replacer

    by Görkem YILDIZ

    39K users314Free

    One Click, Endless Font Possibilities

  5. 36K users309Free

    Font Management, Font Pairs and Typography

  6. 34K users485Free

    Automatically generate text style guides based on your defined local text styles.

FAQ

Fix San Francisco FAQ

What does Fix San Francisco do?

Easily apply the correct tracking based on font size for SF Pro and New York texts. It's a Figma plugin by Charlie Chao that runs in Figma Design.

Is Fix San Francisco free?

Yes. Fix San Francisco is free to install and run from the Figma Community, with no paid tier listed.

Is Fix San Francisco safe to use?

Figma plugins can only reach the internet through domains listed in their manifest. Fix San Francisco declares no network access, so it runs entirely inside Figma and can't send your file anywhere. As with any plugin, check the developer's privacy policy before using it on client work.

How do I install Fix San Francisco?

Open it on the Figma Community, or search for it in the Actions menu (Cmd/Ctrl + K) inside any file you can edit. See how to install Figma plugins.

What are the best alternatives to Fix San Francisco?

By user count, the closest alternatives are Font Replacer Ultimate 🔁 Swap change and replace fonts, Typescale and Type Tool. Compare all of them on the best Figma plugins for typography.

For developers

Built this plugin?

Use this page as a landing page for Fix San Francisco: link to it from your site, README or launch posts, or add a badge. Pick a style and copy the code.

Fix San Francisco on figmaplugins.co

Style

Label

Size

Code

<a href="https://figmaplugins.co/plugins/fix-san-francisco/" target="_blank" rel="noopener"><img src="https://figmaplugins.co/badges/featured-dark.svg" alt="Fix San Francisco on figmaplugins.co" width="220" height="48"></a>