Lighten red color dont work

styled-components / polished

A lightweight toolset for writing styles in JavaScript ✨

https://polished.js.org/

MIT License

7.6k stars 209 forks source link

Lighten red color dont work #587

Closed lucasmoura-boticario closed 2 years ago

lucasmoura-boticario commented 2 years ago

polished version: 4.1.3
styled-components : 3.3.0
React: 16.3.2

Mixin/Helper/Shorthand Usage

background-color: ${lighten(0.5, "#f00")};

What You Are Seeing

Lighten dont work red colors

What You Expected To See

Lighten red color

Reproduction

https://codesandbox.io/s/smooth-ui-example-forked-sg8iw?file=/src/index.js

bhough commented 2 years ago

@lucasmoura-boticario Thank you for submitting this issue. Lighten is working as intended here. You can only lighten certain colors so far before they become white. Because of the lightness of your original color, going past 0.4 as your first parameter value turns this particular color white. If you changed it to 0.4, for example, you would see a lighter shade of your original red.