The Chromium-based Microsoft Edge didn’t really focus on web design elements and Fluent Design is also missing, but this will apparently change in the near future. Microsoft is working on modern elements and controls for Edge browser, and it should be coming soon to the Chromium-based browsers as well.
A Microsoft Edge Canary update that was pushed out earlier today has updated the functionality of experimental flag ‘Web Platform Fluent Controls’. After the latest update, Web Platform Fluent Controls flags works and it adds support for a new modern colour picker to Edge browser.
The popup-based colour picker gives you the ability to pick accurate colours, but it has always used the dated legacy UI in Chromium-browsers.
In the latest update, Microsoft Edge has picked up support for modern colour picker which replaces the legacy colour picker. The updated colour picker has compact UI and it uses modern elements.
To enable modern colour picker in Edge, follow these steps:
- Open Edge://flags.
- Search for ‘Web Platform Fluent Controls’
- Enable the flag.
According to a commit, Microsoft also wants to implement support for modern colour picker in the Chromium project, so browsers like Chrome can benefit. The commit is marked as ‘active’ and the new colour picker should also show up in other browsers soon.
“This change is the first of several to introduce (behind the form controls refresh flag) a new popup-based color picker to power the color control,” Microsoft Edge engineer explained the implementation in the commit.
“This is the top-level custom element for the color picker implementation. The color picker is compromised of three main parts: a visual color picker to allow visual selection of colors, a manual color picker to allow numeric selection of colors, and submission controls to save/discard new color selections,” the commit reads.
A similar flag titled ‘Web Platform Controls updated UI’ is available in Chrome Canary, but it does nothing for now.
It’s also worth noting that you will not see new colour picker if a website maintains its own tool.
