Flutter Color installs statistics
By Nilesh Chavan · VS Code Marketplace · Other
This plugin help you to visualize the colors used in your project.
Flutter Color has 571,624 recorded installs on VS Code Marketplace, ranking #787 of 2,501 tracked listings.
Rating: 4.63 / 5 from 8 ratings
About Flutter Color
Welcome to Flutter Color VS Code Extension 🎨✨
A user-friendly plugin to help you visualize the colors used in your project. Initially developed for Flutter, it is now used in various programming languages. It automatically parses and converts your color code into a small color picker box, allowing you to see and change the color as desired.
🚀🌕 Celebrating Chandrayaan's Glorious Landing and a Promising Future! 🌌✨
Dear All, Last year on celeberation of successfull landing of changrayaan 3, I decided to make few structural changes in the plugin, so that new features can be easily developed.Today, I’m excited to announce that these changes have been successfully implemented. Here’s what’s new:
- Implemented Telemetry & Crash Reporting 📊 2. Added test cases ✅ 3. Refactored code 🔧
If you haven't tried this plugin yet, head over to VS Code -> Extensions -> search for "Flutter Color" -> Install and start using it! I’d love to hear your feedback.
Upcoming Features
- Enable users to convert color codes between various formats such as RGBA, HEX, RGB, ARGB, etc. For example, users can input a HEX code, and the plugin will convert it to the RGBA format. 2. __________
Feel free to add your thoughts as well. You can follow this link to share your ideas directly - Your Idea
Features
Gif by Maruf Hassan on Medium.
Without Flutter Color
With Flutter Color
Without Flutter Color (JSON file)
With Flutter Color (JSON file)
Feel free to contribute. Any new ideas are accepted, if you want to contribute, submit a pull request
Configuration
Flutter Color provides customizable settings to match your coding style preferences. Access these settings in VS Code:
File > Preferences > Settings (or Code > Settings > Settings on macOS) → Search for "Flutter Color"
Available Settings
Hex Format (flutterColor.hexFormat)
Control the letter case for hexadecimal color values.
• Options: • "upper case" (default) - Display hex values in uppercase (e.g., #FF5733) • "lower case" - Display hex values in lowercase (e.g., #ff5733)
Example Configuration:
Before (upper case):
After (lower case):
Include Alpha Channel (flutterColor.includeAlpha)
Control whether to display the alpha (transparency) channel in color previews.
• Type: Boolean • Default: true • Effect: When false, the alpha channel is omitted from displayed color values
Example Configuration:
Before (includeAlpha: true):
After (includeAlpha: false):
Applying Settings to Your Workspace
You can configure these settings at different levels:
User Settings (applies globally):
Workspace Settings (applies to current project only): Create or edit .vscode/settings.json in your project root:
Supported Color Formats
These settings apply to all supported color formats: • Flutter/Dart: Color(0xFF123456), Color.fromARGB(255, 18, 52, 86) • Hex: #123456, #FF123456 • ARGB: #AARRGGBB • JSON: Color values in .json files • JavaScript/TypeScript: Color values in .js, .ts files • Kotlin/Android: Color values in .kt, .kts files
What's new ?
• ### Version 2.3.0 (12.06.2026) • [New] Added support for Kotlin files [PR #88 - Thanks to nihaltp] • [Security] Updated dependencies (webpack, minimatch, flatted, picomatch, fast-uri, uuid, nyc) to fix security vulnerabilities • ### Version 2.2.0 (32.12.2025) • [Fixed] Added configuration of RGB value on colour picker [Issue #7, PR #79] • ### Version 2.1.0 (26.12.2025) • [New] Added configuration settings to customize hex format (uppercase/lowercase) and control alpha channel display [#67, PR #63] • [Fixed] Corrected alpha channel handling in color strategies for proper opacity detection • ### Version 2.0.0 (09.09.2024) • [New] Refactor the code, Added Test cases, Implemented Telemetry & crash reporting [#Milestone 1 - 2023 Last Quarter Release ]. • ### Version 1.1.0 (25.08.2023) • [New] Updated the README file to show the missing images & published the extension to Open VSX. [#29 - Thanks to mrhyperbit] . • ### Version 1.0.1 (04.03.2021) • [New] Integration of Color palette: supports all languages except CSS, LESS, and SCSS. We don't want to break the internal features of VS Code, which is why we are not supporting these languages. [#9 - Thanks to lr222gw] [#10 - Thanks to Littlegolden] . • ### Version 0.1.1 (26.09.2020) • [FIXED] Issue resolved for the ternary operator of the color palette [Thanks to Diego Carvalho] . • ### Version 0.1.0 (25.09.2020) • [NEW] Integration of Color palette for JSON files [#6 - Thanks to MewX]. • ### Version 0.0.2 (03.01.2020) • [NEW] Integration of Opacity in The color palette.
Changelog
To check full changelog click here.
Made with ( ❤ ) by CCS 🌟
Description from the VS Code Marketplace listing.
- android
- color
- dart
- futlter
- ios
- json
- yml
README badge
Show your rank in a README or on your website. The badge updates automatically.
Charts
Images: 30d · 1y · all time · 1600×900 dark
Adoption over time
7/30/90-day growth
Ranking history
Ratings over time
Listing placement
Listing placement
Filled points are observed values; hollow points come from Internet Archive snapshots of the listing page. Dashed segments span periods with no observations — values between points are not interpolated.
Each band is one page of 20. Installs on a linear scale. Placement is projected from installs, so it can differ from the marketplace's own sort order. Hover a dot to see the listing.
Recent observations
Full history (4)Similar VS Code Marketplace Other plugins
All 20 Flutter Color alternativesData source
Install counts, average rating, and rating counts come from the public Visual Studio Marketplace gallery API. Installs are cumulative and exclude updates.
Listing: https://marketplace.visualstudio.com/items?itemName=circlecodesolution.ccs-flutter-color. First seen Oct 16, 2026; last successful collection Oct 19, 2026. See the methodology.