# "Time" input icon is black on dark theme

**URL:** https://meta.discourse.org/t/time-input-icon-is-black-on-dark-theme/250771
**Category:** UX
**Created:** [January 5, 2023, 12:03am UTC](https://meta.discourse.org/t/time-input-icon-is-black-on-dark-theme/250771 "2023-01-05T00:03:21Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [January 5, 2023, 12:03am UTC](https://meta.discourse.org/t/time-input-icon-is-black-on-dark-theme/250771/1 "2023-01-05T00:03:21Z")

</div>

See:

 ![black time icon on dark theme](https://global.discourse-cdn.com/meta/original/4X/c/8/a/c8a5f9f55d13f03235a5ab6316fb52777165e98d.png)

It’s expected to be a light color, probably `var(--primary)`. 🙂

* * *

I notice it uses a time input which I wasn’t aware it existed, so I don’t know if it can be changed, especially if the design varies depending on the device/browser used 🤔

* * *

I use Desktop Chrome 108.0.5359.125 on Windows 11.

---

<div class="post-metadata">

### Author: ![Stephen](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/stephen/32/95011_2.png) [@Stephen](https://meta.discourse.org/u/Stephen)
#### Post date: [January 5, 2023, 12:10am UTC](https://meta.discourse.org/t/time-input-icon-is-black-on-dark-theme/250771/2 "2023-01-05T00:10:45Z")

</div>

I don’t see the second time indicator:

 ![Screenshot 2023-01-04 at 6.11.23 PM](https://global.discourse-cdn.com/meta/original/4X/0/8/3/083e0e16aafe4bc0f0281f318039ccb84b6ddfdd.png)

What device/OS/browser combination is this?

---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [January 5, 2023, 12:12am UTC](https://meta.discourse.org/t/time-input-icon-is-black-on-dark-theme/250771/3 "2023-01-05T00:12:21Z")

</div>

I edited my topic to add this info: Desktop Chrome 108.0.5359.125 on Windows 11.

---

<div class="post-metadata">

### Author: ![Stephen](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/stephen/32/95011_2.png) [@Stephen](https://meta.discourse.org/u/Stephen)
#### Post date: [January 5, 2023, 12:15am UTC](https://meta.discourse.org/t/time-input-icon-is-black-on-dark-theme/250771/4 "2023-01-05T00:15:53Z")

</div>

I can repro on Chrome. It adds a clock to `input type="time"`.

---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [January 5, 2023, 12:17am UTC](https://meta.discourse.org/t/time-input-icon-is-black-on-dark-theme/250771/5 "2023-01-05T00:17:46Z")

</div>

[https://stackoverflow.com/questions/63002686/how-do-i-change-the-color-of-the-small-clock-icon-that-comes-with-the-html-input#comment119665982\_64184578](https://stackoverflow.com/questions/63002686/how-do-i-change-the-color-of-the-small-clock-icon-that-comes-with-the-html-input#comment119665982_64184578) for a Webkit-based browsers solution.

---

<div class="post-metadata">

### Author: ![Stephen](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/stephen/32/95011_2.png) [@Stephen](https://meta.discourse.org/u/Stephen)
#### Post date: [January 5, 2023, 12:19am UTC](https://meta.discourse.org/t/time-input-icon-is-black-on-dark-theme/250771/6 "2023-01-05T00:19:33Z")

</div>

If you don’t want to see the clock you can always

```plaintext
input[type="time"]::-webkit-calendar-picker-indicator {
    background: none;
}

```
