Stop Creating Custom Checkboxes - Do This Instead

🌎 Find Me Here:

#Shorts

[marvelBoy]

dude keep on doing this, its too useful

[ivanbragin]

People make custom checkboxes and range sliders because there is no way to properly style them or add animations, color is a less of a concern. Also different browsers have different checkboxes and therefore UI will look inconsistent

[josephlivengood]

The border color will also take the text color by just leaving out the color property. border: 1px solid;

[zombiefacesupreme]

What!!?? I was literally about to bring in Daisy UI just for this. Thank you so much Kyle!!

[arthurmiranda]

Dude, you saved me so much time, thanks!

[omnomnom]

I really like your shorts=) you are awersome=)

[dimrachkool]

This video was useful fir me.
Thank you Kyle!

[michielarkema]

Hell yeah, this is amazing! Thanks Kyle

[jurgenbjansen]

You are Da best my brother!!! Thanks for this priceless gift!!!

[rfryanfavour]

God damn Kyle you just saved my life 😭😭💙💙 I was using before after pseudo stuffs

[justmyself]

Omg he has such grace and ability at tje same time
Love him, sorry but he is an inspiration

[techsavvytravvy]

i would probably hold off on using accent-color since it just got added to most browsers this year.

[chinmayghule]

Sadly I need more customization than this in my current project. I need to set up a custom icon inside, or at least the color of the tick should be customizable.

[lighttigerxiv]

Some weeks ago i wasted an hoir until i found the accent color and now youtube recommends it haha

[romzamir]

It's important to mention that the accent-color property is relatively new and only available in chrome 93 and later

[mohammedezzinehaddady]

You actually don't need currentcolor property by default if border color is not set it uses text color

[TanelM]

Styling checkboxes is inconsistent across browsers and operating systems. I've tried to make a native checkbox bigger and had it look acceptable on any browser, except in Ubuntu Firefox where only the box was larger, but the checkmark didn't scale.

[georgios_georgiou]

Really depends on the design I guess you might want to apply more styles than the checkbox/progress bar color. I like the currentColor thing though definitely saves time if you make a design token theme.

[uroojkhan]

There is no need to write currentColor is border if you want to use same color as font color you can write like:
border:1px solid;

[maheenkashish]

Love your videos! Please tell me how can i make these check boxes as radio?