Color Picker - BestDevTools.io

About

The BestDevTools.io Color Picker is a complete and powerful extension designed for designers, developers, and content creators. Capture any color on screen with pixel precision, generate professional gradients, and export everything in various formats—all within a clean and elegant side panel.

This extension includes a professional color picker with pixel zoom, full history, favorites, gradient generator, and even image export, making it one of the most versatile tools for modern visual workflows.

🎯 Professional Color Capture

Native Chrome EyeDropper

- Select any color directly from the screen with pixel precision
- Native browser technology for maximum accuracy
- Intuitive and responsive interface

Integrated Manual Editor

- Manually adjust colors with the color picker
- View changes in real time
- Perfect for fine-tuning and refinements

Multiple Export Formats

- HEX: Hexadecimal code (RRGGBB) - web standard
- RGB: Red, Green, Blue values ​​(rgb(r, g, b))
- HSL: Hue, Saturation, Lightness (hsl(h, s%, l%))
- Instant copy with a single click

Smart History

- Automatically save up to 50 captured colors
- Quick access to recent colors
- Remove individual colors or clear everything at once
- Organize your favorite palettes

🌈 Gradient Generator Advanced

Three Gradient Types

- Linear: Linear gradients with direction control (0-360°)
- Radial: Circular gradients with center positioning (X/Y)
- Conical: Conical gradients for unique and modern effects

Precise Controls

- Adjust the direction of the linear gradient (0-360 degrees)
- Position the center of radial and conical gradients (X/Y in percentage)
- Individual control of the position of each color (0-100%)
- Real-time preview of all changes

Multiple Color Selection

- Choose from 2 to 5 colors to create complex gradients
- Intuitive visual interface for selection
- Reorder colors with drag and drop
- Fine-tune the position of each color in the gradient

Favorites System

- Save up to 30 custom gradients
- Quickly access your favorite gradients
- Edit saved gradients with a Click

- Organize and reuse your creations

📤 Export and Sharing

Ready-to-Use CSS Code

- Generate complete and optimized CSS code
- Instant copy with a single click
- Compatible with all modern CSS frameworks
- Support for linear-gradient, radial-gradient, and conic-gradient

Export Images in Multiple Formats
Create gradient images optimized for different platforms:

- Instagram Post: 1080x1080 pixels
- Instagram Story/Reels: 1080x1920 pixels
- Facebook Post: 1200x630 pixels
- Twitter Post: 1200x675 pixels
- LinkedIn Post: 1200x627 pixels
- YouTube Thumbnail: 1280x720 pixels
- Pinterest Pin: 1000x1500 pixels
- Desktop Wallpaper: 1920x1080 pixels
- Mobile Wallpaper: 1080x1920 pixels

Direct download in high-quality PNG format.

🌍 Multi-language Support

Interface fully translated into 10 languages:

- 🇺🇸 English
- 🇧🇷 Portuguese (Brazil)
- 🇪🇸 Spanish
- 🇫🇷 French
- 🇩🇪 German
- 🇷🇺 Russian
- 🇨🇳 Chinese
- 🇯🇵 Japanese
- 🇮🇹 Italian
- 🇮🇳 Hindi (Hindi)

🎯 Who is this extension for?

👨‍🎨 Designers

- Capture color palettes from inspiring websites
- Create professional gradients for projects
- Organize and reuse brand palettes
- Export backgrounds for social media

👨‍💻 Developers

- Instantly generate CSS code for complex gradients
- Capture colors from designs for implementation
- Quickly test different color combinations
- Easily integrate into web projects

📱 Content Creators

- Create optimized backgrounds for each social network
- Generate custom thumbnails for videos
- Develop a consistent visual identity
- Export in platform-specific formats

🏢 Marketing Professionals

- Maintain brand color consistency
- Quickly create visual materials
- Organize color palettes by project
- Share gradients with the team

🚀 How to Use

Color Capture

1. Click the extension icon in the toolbar
2. Click "Find a Color
3. Select any color on the screen with the EyeDropper
4. The color will be automatically copied and saved to the history

Gradient Generation

1. Select 2 to 5 colors from your history
2. Click the "Generate Gradient" button
3. Choose the gradient type (Linear, Radial, or Conical)
4. Adjust direction and positioning as needed
5. Copy the CSS code, export as an image, or save as a favorite

🔒 Privacy and Security

- No data collection: All colors and gradients are stored locally in your browser
- No connection to external servers: Everything works offline after installation

📝 Release Notes

Version 1.0.1

- Added support for Italian and Hindi
- Language selector interface improvements
- Alignment and usability fixes
- Performance optimizations

Version 1.0.0

- Initial release
- Color capture with EyeDropper
- Gradient generator (Linear, Radial, Conic)
- Export in multiple formats
- Support for 8 languages
- Favorites system

Developed with ❤️ by the BestDevTools.io team