I’ve created custom checkbox using unicode checkmark: ✔️
Checkbox looks like this:
It looks the same on every browser/device except IOS mobile Safari, where it looks as following:
The problem is that both screens presents
unchecked state, but on IOS Safari it looks more like it’s checked.
It turned out, that mobile Safari is the only one which translates ✔️ into emoji, which colors cannot be changed in any way.
To prevent Safari from translating special symbols into emoji add
For HTML like this:
For CSS content like this:
fe0e is mentioned above:
This variation code can be found