---
title: "Design Sync — Free Framer plugin · Best of Framer"
description: "Free Framer plugin · by Pixels · Styles. Screenshots, details, and remix links on Best of Framer."
canonical: "https://framer.elliotli.dev/plugin/design-sync"
---

[Home](/)/[Plugins](/plugins)/[Styles](/plugins/category/styles)/Design Sync

# Design Sync

Figma to Framer Sync

[View on Framer](https://framer.com/marketplace/plugins/design-sync/?via=elliot-li)

![Design Sync preview image 1](https://framer.elliotli.dev/og/plugin/design-sync/006a5b6377962126/1600x1200.jpg)

## Summary

Figma to Framer Sync

## Description

**Bridging the gap between your Figma designs and Framer projects.**

Stop wasting time manually copying hex codes, recreating text styles, and managing dark mode variants across platforms. Figma Sync is the ultimate bridge between your design tool and your Framer canvas.

With just a single Figma File URL, this plugin instantly scans your design and generates native, fully-linked Framer Color and Text styles in seconds.

### ✨ **Key Features**

-   **Instant Style Import:** Automatically pull in all your solid colors and typography settings directly from your Figma file.
    
-   **Smart Dark Mode Mapping:** Names your Figma colors with "Light" or "Dark" prefixes? Figma Sync intelligently pairs them together to automatically generate Framer styles with built-in Light and Dark themes.
    
-   **Native Framer Styles:** Creates true Framer Color Styles and Text Styles—meaning if you update the style later, it updates everywhere across your entire Framer site.
    
-   **Secure OAuth:** Uses Figma's official OAuth to securely connect to your account without ever storing your data.
    
-   **Native UI:** Built with a clean interface that seamlessly adapts to Framer’s own light and dark mode for a native feel.
    

### 🚀 **How to use**

1.  **Connect:** Log in with your Figma account directly inside the plugin.
    
2.  **Activate:** Enter your [Polar.sh](http://Polar.sh) license key.
    
3.  **Paste:** Grab your Figma File URL (Click _Share_ -> _Copy Link_ in Figma) and paste it into the plugin.
    
4.  **Sync:** Hit "Sync Figma File" and watch your Framer assets panel populate instantly!
    

## Rank history [How rankings work →](/terms#rankings)

-   All · #182

## Details

- **Author**: Pixels
- **Published**: 2026-07-21
- **Updated**: 2026-07-22
- **Added**: 2026-07-21
- **Categories**: Styles

## More like this

-   [Sealcraft](/plugin/sealcraft) — Cyedi Creative Studio · Free — Badges, stamps and spinning seals
-   [Divider Lab](/plugin/divider-lab) — ANASS TB · Free — Shape dividers for clean sections
-   [Tablecraft](/plugin/tablecraft) — ANASS TB · Free — Paste rows, get a designed table
-   [Cookiewall](/plugin/cookiewall) — ANASS TB · Free — Cookie banners, done in seconds