Browser Extension Installation

The StyleGrab browser extension lets you extract design tokens directly from any page you’re viewing.

Download

Chrome Web Store

Install from the Chrome Web Store (recommended).

Manual Installation

For development or testing:

1. Download the extension ZIP from GitHub Releases
2. Extract the ZIP file
3. Open chrome://extensions/ in Chrome
4. Enable “Developer mode” (toggle in top right)
5. Click “Load unpacked”
6. Select the extracted folder

Setup

1. Connect Your Account

After installation, click the StyleGrab icon in your toolbar and sign in with your StyleGrab account.

2. Grant Permissions

The extension requires permission to:

• Read page content — To extract CSS and design tokens
• Access tabs — To work on the active tab

Verify Installation

1. Navigate to any website
2. Click the StyleGrab icon
3. Click “Extract Tokens”
4. View the extracted design tokens in the side panel

Troubleshooting

Extension icon is grayed out

The extension only works on http:// and https:// pages. It won’t activate on:

• chrome:// pages
• chrome-extension:// pages
• Local files (unless enabled in extension settings)

“Permission denied” errors

1. Go to chrome://extensions/
2. Find StyleGrab and click “Details”
3. Ensure “Site access” is set to “On all sites”

Extraction not working

Some sites block content scripts. Try:

1. Refresh the page
2. Disable other extensions that might interfere
3. Check the browser console for errors

Next Steps

• Using the extension
• API reference for programmatic access