Blink: Intent to Ship: AccentColor and AccentColorText system colors
Blink: Intent to Ship: AccentColor and AccentColorText system colors
Blink: Intent to Ship: AccentColor and AccentColorText system colors
groups.google.com
April 10, 2026 at 9:06 PM
Blink: Intent to Ship: AccentColor and AccentColorText system colors
The current state of AccentColor/AccentColorText:
4 browsers, 4 different color pairs
From left to right: Chrome 148 (stable), Chrome 150 (canary), Safari, Firefox.
Details in thread.
4 browsers, 4 different color pairs
From left to right: Chrome 148 (stable), Chrome 150 (canary), Safari, Firefox.
Details in thread.
May 16, 2026 at 10:55 PM
The current state of AccentColor/AccentColorText:
4 browsers, 4 different color pairs
From left to right: Chrome 148 (stable), Chrome 150 (canary), Safari, Firefox.
Details in thread.
4 browsers, 4 different color pairs
From left to right: Chrome 148 (stable), Chrome 150 (canary), Safari, Firefox.
Details in thread.
Finally a browser is making AccentColor actually useful. github.com/WebKit/WebKi...
Hopefully Chrome and Firefox follow suit.
Hopefully Chrome and Firefox follow suit.
[css-color-4] [css-ui-4] AccentColor system color should use accent-color if set by tuankiet65 · Pull Request #69706 · WebKit/WebKit
f06a616
[css-color-4] [css-ui-4] AccentColor system color should use accent-color if set
rdar://182555280
https://bugs.webkit.org/show_bug.cgi?id=319721
Reviewed by NOBODY (OOPS!).
Explanation of...
github.com
July 19, 2026 at 7:47 PM
Finally a browser is making AccentColor actually useful. github.com/WebKit/WebKi...
Hopefully Chrome and Firefox follow suit.
Hopefully Chrome and Firefox follow suit.
Quick Hit #154
Chrome 150 implements the AccentColor/AccentColorText system-color keywords, making them Baseline.
https://css-tricks.com/quick-hit-154/
Chrome 150 implements the AccentColor/AccentColorText system-color keywords, making them Baseline.
https://css-tricks.com/quick-hit-154/
Quick Hit #154
Chrome 150 implements the AccentColor/AccentColorText system-color keywords, making them Baseline.
css-tricks.com
June 30, 2026 at 2:49 PM
Quick Hit #154
Chrome 150 implements the AccentColor/AccentColorText system-color keywords, making them Baseline.
https://css-tricks.com/quick-hit-154/
Chrome 150 implements the AccentColor/AccentColorText system-color keywords, making them Baseline.
https://css-tricks.com/quick-hit-154/
March 14, 2025 at 2:09 AM
Chrome 150 beta is going to be an exciting update:
- flex-wrap: balance 👀
- Media element pseudo-classes
- focusgroup attribute
- light-dark() with image values
- image() function
- CSS text-fit
- AccentColor and AccentColorText system colours
and more...
#css #html
- flex-wrap: balance 👀
- Media element pseudo-classes
- focusgroup attribute
- light-dark() with image values
- image(
- CSS text-fit
- AccentColor and AccentColorText system colours
and more...
#css #html
Chrome 150 beta | Blog | Chrome for Developers
Get a preview of the next Chrome release with this post detailing the features in the current beta.
developer.chrome.com
June 4, 2026 at 8:29 AM
Testcase: codepen.io/leaverou/pen...
Why would all browsers not use the real OS accent color? Fingerprinting concerns.
Up to you whether this is a reasonable tradeoff. 🤷🏽♀️
Why would all browsers not use the real OS accent color? Fingerprinting concerns.
Up to you whether this is a reasonable tradeoff. 🤷🏽♀️
AccentColor testcase
...
codepen.io
May 16, 2026 at 10:55 PM
Testcase: codepen.io/leaverou/pen...
Why would all browsers not use the real OS accent color? Fingerprinting concerns.
Up to you whether this is a reasonable tradeoff. 🤷🏽♀️
Why would all browsers not use the real OS accent color? Fingerprinting concerns.
Up to you whether this is a reasonable tradeoff. 🤷🏽♀️
Testing
```swift
import SwiftUI
struct ContentView: View {
var body: some View {
VStack {
Image(systemName: "globe")
.imageScale(.large)
.foregroundColor(.accentColor)
Text("Hello, world!")
}
.padding()
}
}
```
```swift
import SwiftUI
struct ContentView: View {
var body: some View {
VStack {
Image(systemName: "globe")
.imageScale(.large)
.foregroundColor(.accentColor)
Text("Hello, world!")
}
.padding()
}
}
```
November 24, 2024 at 7:24 AM
Testing
```swift
import SwiftUI
struct ContentView: View {
var body: some View {
VStack {
Image(systemName: "globe")
.imageScale(.large)
.foregroundColor(.accentColor)
Text("Hello, world!")
}
.padding()
}
}
```
```swift
import SwiftUI
struct ContentView: View {
var body: some View {
VStack {
Image(systemName: "globe")
.imageScale(.large)
.foregroundColor(.accentColor)
Text("Hello, world!")
}
.padding()
}
}
```
Kind of annoying that #SwiftUI can only adapt Color.accentColor to the dimmed state (AFAIK). I made a workaround to expose UIKit's dimmed tint color to SwiftUI for this: gist.github.com/juanarzola/5...
Exposes tintColor in the dimmed state to SwiftUI. Use this to adapt any non-accentColor color to the dimmed state.
Exposes tintColor in the dimmed state to SwiftUI. Use this to adapt any non-accentColor color to the dimmed state. - EnvironmentDimmedTintColorViewModifier.swift
gist.github.com
March 17, 2025 at 9:04 PM
Kind of annoying that #SwiftUI can only adapt Color.accentColor to the dimmed state (AFAIK). I made a workaround to expose UIKit's dimmed tint color to SwiftUI for this: gist.github.com/juanarzola/5...
Already thinking about what features to suggest for Interop 2026: invoker command/commandfor, Sanitizer API, appearance: base, CSS attr() function, CSS random() and random-item() functions, @sheet, WebTransport, ::marker interop, AccentColor interop, CSS alignment for non-grid/non-flex items…
May 24, 2025 at 5:56 PM
Already thinking about what features to suggest for Interop 2026: invoker command/commandfor, Sanitizer API, appearance: base, CSS attr() function, CSS random() and random-item() functions, @sheet, WebTransport, ::marker interop, AccentColor interop, CSS alignment for non-grid/non-flex items…
Spent some time debugging an issue where a SwiftUI-based app didn't properly propagate the AccentColor defined in the asset catalog. Turned out calling `UIFont.preferredFont(forTextStyle:)` in the App struct’s init method breaks the propagation. 👀
#iosdev
#iosdev
March 5, 2026 at 3:31 PM
Spent some time debugging an issue where a SwiftUI-based app didn't properly propagate the AccentColor defined in the asset catalog. Turned out calling `UIFont.preferredFont(forTextStyle:)` in the App struct’s init method breaks the propagation. 👀
#iosdev
#iosdev
#CSSence #AdventCalendar Day 14
Earlier this year I may have been a bit too optimistic about Chrome/Edge/Opera/… catching up with support of AccentColor(Text).
»Accent Color Access, Revisited«
cssence.com/2024/accent-...
#CSS #SystemColors
Earlier this year I may have been a bit too optimistic about Chrome/Edge/Opera/… catching up with support of AccentColor(Text).
»Accent Color Access, Revisited«
cssence.com/2024/accent-...
#CSS #SystemColors
accent-color is no CSS variable, revisited
But did you know there are also AccentColor and AccentColorText?
cssence.com
December 14, 2024 at 7:51 AM
#CSSence #AdventCalendar Day 14
Earlier this year I may have been a bit too optimistic about Chrome/Edge/Opera/… catching up with support of AccentColor(Text).
»Accent Color Access, Revisited«
cssence.com/2024/accent-...
#CSS #SystemColors
Earlier this year I may have been a bit too optimistic about Chrome/Edge/Opera/… catching up with support of AccentColor(Text).
»Accent Color Access, Revisited«
cssence.com/2024/accent-...
#CSS #SystemColors
Managed to get a pretty customized DatePicker going through custom "input" component that an invisible date picker overlays. Then you just add these modifiers.
DatePicker(...)
.accentColor()
.labelsHidden()
.datePickerStyle(.compact)
.colorMultiply(.clear)
DatePicker(...)
.accentColor()
.labelsHidden()
.datePickerStyle(.compact)
.colorMultiply(.clear)
October 27, 2024 at 2:46 PM
Managed to get a pretty customized DatePicker going through custom "input" component that an invisible date picker overlays. Then you just add these modifiers.
DatePicker(...)
.accentColor()
.labelsHidden()
.datePickerStyle(.compact)
.colorMultiply(.clear)
DatePicker(...)
.accentColor()
.labelsHidden()
.datePickerStyle(.compact)
.colorMultiply(.clear)
#cssWish to be able to use accentColor as a value, the same way I can currentColor 🥺
October 4, 2023 at 7:57 AM
#cssWish to be able to use accentColor as a value, the same way I can currentColor 🥺
With .NET 9.0 there's an API to access a user's Accent Color in your WPF app. The Accent Color is defined in the Windows Settings app. Learn more about it in my latest blog post:
www.thomasclaudiushuber.com/2025/03/27/w...
#WPF #dotnet #csharp #windows #programming #accentcolor #settings
www.thomasclaudiushuber.com/2025/03/27/w...
#WPF #dotnet #csharp #windows #programming #accentcolor #settings
www.thomasclaudiushuber.com
March 27, 2025 at 2:56 PM
With .NET 9.0 there's an API to access a user's Accent Color in your WPF app. The Accent Color is defined in the Windows Settings app. Learn more about it in my latest blog post:
www.thomasclaudiushuber.com/2025/03/27/w...
#WPF #dotnet #csharp #windows #programming #accentcolor #settings
www.thomasclaudiushuber.com/2025/03/27/w...
#WPF #dotnet #csharp #windows #programming #accentcolor #settings
did u know that on Firefox on modern Android, the CSS system color `AccentColor` represents the current Material You theme? kinda neat. so websites can look right at home in your themed device.
December 16, 2025 at 9:19 AM
did u know that on Firefox on modern Android, the CSS system color `AccentColor` represents the current Material You theme? kinda neat. so websites can look right at home in your themed device.
Another Safari one I totally assumed and missed: the `accentColor` and `accentColorText` UA color keywords. Now globally supported instead of having to -webkit-focus-ring-color or whatever. In Chrome 149:
developer.chrome.com/release-note...
developer.chrome.com/release-note...
Chrome 149 | Release notes | Chrome for Developers
CSS gap decorations, path() and shape() in shape-outside, disconnect WebSockets on bfcache entry, and more.
developer.chrome.com
June 11, 2026 at 3:40 PM
Another Safari one I totally assumed and missed: the `accentColor` and `accentColorText` UA color keywords. Now globally supported instead of having to -webkit-focus-ring-color or whatever. In Chrome 149:
developer.chrome.com/release-note...
developer.chrome.com/release-note...
Isn't it equivalent to just AccentColor? Minus the fact that at least WebKit kneecapped that feature?
July 27, 2025 at 6:27 AM
Isn't it equivalent to just AccentColor? Minus the fact that at least WebKit kneecapped that feature?
I get the argument that it's to allow web components feature parity (because AccentColor "had" to be fake) but I wholeheartedly disagree with that decision. We shouldn't make the built-ins worse in the name of parity. Unfortunately that argument won out and here we are.
May 17, 2026 at 9:39 PM
I get the argument that it's to allow web components feature parity (because AccentColor "had" to be fake) but I wholeheartedly disagree with that decision. We shouldn't make the built-ins worse in the name of parity. Unfortunately that argument won out and here we are.
What’s new in Chrome 150. AccentColor system colors for installed apps, polygon() corner rounding, animatable zoom, url() modifiers, the new text-fit property, background-clip: border-area, and scroll methods that return promises. #chrome #browser
developer.chrome.com...
developer.chrome.com...
July 2, 2026 at 10:00 AM
What’s new in Chrome 150. AccentColor system colors for installed apps, polygon() corner rounding, animatable zoom, url() modifiers, the new text-fit property, background-clip: border-area, and scroll methods that return promises. #chrome #browser
developer.chrome.com...
developer.chrome.com...
the fact that I
- can't turn on a Chrome flag to enable global use of AccentColor
- can't write a userscript to do it
- can't write an extension to do it
pmo so much
- can't turn on a Chrome flag to enable global use of AccentColor
- can't write a userscript to do it
- can't write an extension to do it
pmo so much
August 4, 2026 at 6:01 PM
the fact that I
- can't turn on a Chrome flag to enable global use of AccentColor
- can't write a userscript to do it
- can't write an extension to do it
pmo so much
- can't turn on a Chrome flag to enable global use of AccentColor
- can't write a userscript to do it
- can't write an extension to do it
pmo so much
🎨 𝑃𝑟𝑜𝑣𝑖𝑑𝑖𝑛𝑔 𝑀𝑢𝑙𝑡𝑖𝑝𝑙𝑒 𝐴𝑐𝑐𝑒𝑛𝑡 𝐶𝑜𝑙𝑜𝑟𝑠 𝑖𝑛 𝑆𝑤𝑖𝑓𝑡𝑈𝐼 𝐴𝑝𝑝𝑠 by Gabriel Theodoropoulos
Let users personalize your app! Learn how to implement multiple accent colors for customizable, personal experiences.
#SwiftUI #AccentColor #Customization
Let users personalize your app! Learn how to implement multiple accent colors for customizable, personal experiences.
#SwiftUI #AccentColor #Customization
Providing Multiple Accent Colors in SwiftUI Apps – SerialCoder.dev
serialcoder.dev
October 1, 2025 at 11:06 AM
🎨 𝑃𝑟𝑜𝑣𝑖𝑑𝑖𝑛𝑔 𝑀𝑢𝑙𝑡𝑖𝑝𝑙𝑒 𝐴𝑐𝑐𝑒𝑛𝑡 𝐶𝑜𝑙𝑜𝑟𝑠 𝑖𝑛 𝑆𝑤𝑖𝑓𝑡𝑈𝐼 𝐴𝑝𝑝𝑠 by Gabriel Theodoropoulos
Let users personalize your app! Learn how to implement multiple accent colors for customizable, personal experiences.
#SwiftUI #AccentColor #Customization
Let users personalize your app! Learn how to implement multiple accent colors for customizable, personal experiences.
#SwiftUI #AccentColor #Customization
drafts.csswg.org/css-color/#v..., also "AccentColor" changes based on whatever system color you have set up? woah. (originally found after search through web.dev/articles/lig...)
CSS Color Module Level 4
drafts.csswg.org
November 19, 2024 at 7:19 AM
drafts.csswg.org/css-color/#v..., also "AccentColor" changes based on whatever system color you have set up? woah. (originally found after search through web.dev/articles/lig...)
In Chrome beta, native form controls no longer reflect the users system preferences. Weird to describe this as a "feature launch" that "introduces more consistent user expectations for system colors" when it's actually a regression.
![Screenshot of the following text: Restricts access to the system accent color for CSS keywords and accent-color: auto to be only within a web app and initial profile context.
The AccentColor and AccentColorText CSS keywords pose a significant fingerprinting vector when exposing the user's system colors widely on the web. As such, they're only available in installed web app contexts. Form controls with accent-color: auto also match this scope with this feature launch. This introduces more consistent developer and user expectations for system colors and aligns with fingerprinting restrictions for AccentColor [Text].](https://cdn.bsky.app/img/feed_thumbnail/plain/did:plc:n34etccppmw5butntcjnaejv/bafkreihm4lqkzfrhtehw42acnpura6xzby5i7jfnjo7j4l73f7dpenxhwe)
May 7, 2026 at 12:24 PM
In Chrome beta, native form controls no longer reflect the users system preferences. Weird to describe this as a "feature launch" that "introduces more consistent user expectations for system colors" when it's actually a regression.