Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[docs][figma] Clarity state or Figma Plugin component export #43543

Merged
merged 6 commits into from
Sep 2, 2024
Merged

[docs][figma] Clarity state or Figma Plugin component export #43543

Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
521adef
[docs][figma] Clarity state or Figma Plugin component export
oliviertassinari Aug 31, 2024
145feb9
Update docs/data/material/design-resources/material-ui-sync/material-…
oliviertassinari Aug 31, 2024
db039c6
Update docs/data/material/design-resources/material-ui-sync/material-…
oliviertassinari Aug 31, 2024
3df1da1
Update docs/data/material/design-resources/material-ui-sync/material-…
oliviertassinari Aug 31, 2024
bb988fe
simpler
oliviertassinari Aug 31, 2024
b765509
Update docs/data/material/design-resources/material-ui-sync/material-…
oliviertassinari Sep 2, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 4 additions & 5 deletions docs/data/material/design-resources/material-ui-sync/material-ui-sync.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,13 +56,12 @@ After you've added your custom tokens, click on **Regenerate theme** to include

## Customizing components

The Sync plugin can also generate theme styles for customized components, enabling you to completely change their look and feel and create your custom design system from within Figma.

:::info
This feature is currently limited to the Button, Switch, and Typography components.
Support for more components is coming soon.
:::warning
zanivan marked this conversation as resolved.
Show resolved Hide resolved
This feature is experimental and limited to the **Button**, **Switch**, and **Typography** components.
:::

The Sync plugin can also generate theme styles for customized components, enabling you to completely change their look and feel and create your custom design system from within Figma.

As an example, here's how to customize the checked state, medium size, and primary color of a Switch component to replicate the iOS look and feel:

<img src="/static/material-ui/design-resources/sync-component-variant.png" style="width: 814px; margin-bottom: 8px;" alt="A specific variant of the Switch component selected in the Design Kit." width="1628" height="400" />
Expand Down