Importing styles
Importing styles replaces the default baseline with your own token values, so you do not have to set every color, font, and scale by hand. Open Import styles from the heading of the brand's Styles page, or use the Import your brand styles step of the setup guide on the brand overview, and choose the source that matches what you already have.
Import Figma variables
If your tokens live as variables in a Figma file, the UI Rules plugin imports the variable collections you pick as the brand's design tokens, light and dark modes included. This is the tab the dialog opens on, and it is a guide rather than a form: the import runs from Figma's side, so there is nothing to paste here. Run the plugin in your Figma library file, choose Connect to UI Rules and approve in your browser, then select collections and confirm the import back in Figma. See the Figma plugin.
What happens on import
Every import previews first. UI Rules reads what you pasted, shows a report of what Will apply and what it Skipped, and writes nothing until you apply. Once applied, the same report shows what changed.
Importing sets your brand's token values. It does not write rules. After importing, author rules on each style area to tell AI tools how to use the values. See the Styles overview.
Scanning a website from elsewhere
Besides the Website tab, the Agent can read a site's tokens, and so can connected AI tools over MCP when the connection key carries the token:import scope. Either way it previews first and writes nothing until you approve. See What a tool can change.
