This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.


The ::-ms-check CSS pseudo-element represents the checkmark of an <input> of type="checkbox" or type="radio".

This pseudo-element is non-standard and only supported in Internet Explorer and Edge, as indicated by the vendor prefix (-ms for Microsoft).




HTML Content

    <label for="redButton">Red</label>
    <input type="radio" id="redButton"><br>
    <label for="greenCheckbox">Green</label>
    <input type="checkbox" id="greenCheckbox">

CSS Content

input, label {
    display: inline;

input[type=radio]::-ms-check {
    color: red; /* This will make the circle red when the button is checked. */

input[type=checkbox]::-ms-check {
    color: green; /* This will make the checkmark green when the button is checked. */

Below is the example for you to try. The screenshot to the left shows what will happen when you check the buttons if you don't have access to Internet Explorer or Edge.

ScreenshotLive sample


Not part of any specification.

Microsoft has a description on MSDN that lists various properties that can be set on this pseudo-element.

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support No support No support 10.0 No support No support
Feature Android Chrome for Android Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile iOS WebKit
Basic support No support No support No support No support ? No support No support

Document Tags and Contributors

 Contributors to this page: Sebastianz, pgustafs, kscarfone, cvrebert
 Last updated by: Sebastianz,