diff --git a/CHANGELOG.md b/CHANGELOG.md index d70f9a0..040a313 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,7 +7,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## [Unreleased] -- Nothing yet! +### Fixed + +- Use normal `checkbox` and `radio` appearance in `forced-colors` mode ([#152](https://github.com/tailwindlabs/tailwindcss-forms/pull/152)) ## [0.5.6] - 2023-08-28 diff --git a/src/index.js b/src/index.js index 04a3992..dd2953f 100644 --- a/src/index.js +++ b/src/index.js @@ -251,6 +251,10 @@ const forms = plugin.withOptions(function (options = { strategy: undefined }) { 'background-image': `url("${svgToDataUri( `` )}")`, + + '@media (forced-colors: active) ': { + appearance: 'auto', + }, }, }, { @@ -260,6 +264,10 @@ const forms = plugin.withOptions(function (options = { strategy: undefined }) { 'background-image': `url("${svgToDataUri( `` )}")`, + + '@media (forced-colors: active) ': { + appearance: 'auto', + }, }, }, { @@ -292,6 +300,10 @@ const forms = plugin.withOptions(function (options = { strategy: undefined }) { 'background-size': `100% 100%`, 'background-position': `center`, 'background-repeat': `no-repeat`, + + '@media (forced-colors: active) ': { + appearance: 'auto', + }, }, }, {