Welcome to DesignPicker! 🎉

Let's get started with a quick guide on how to use the extension.

1

Pin the Extension

Click the puzzle icon in your browser toolbar, find DesignPicker, and click the pin icon to keep it easily accessible.

Pin Extension
2

Refresh the Page

After pinning the extension, refresh the current page to ensure DesignPicker is properly activated.

Refresh Page
3

Start Using DesignPicker

Click the DesignPicker icon to access powerful design analysis tools:

ColorPicker: Extract and Analyze Colors

Using ColorPicker

FontDetector: Identify Typography

Using FontDetector
4

Watch the video to learn how to use the core features

This video demonstrates:
🔍 Get webpage colors & fonts with one click
🎨 Full-screen color picker for precise selection
🖋️ Web font detection and analysis
⚙️ Personalized usage preferences