Font-awesome: Icon request: icon-check-all icon-uncheck-all

[shyndman]

Examples:

I suppose you could get away with stacking the existing icons. I might give that a shot to see how it looks.

[gramx]

I think there is a bad link there for one of thoughs here is another example:

[wstrik]

+1

[suhuichen]

+1

[chellberg]

+1

[mafk]

+1

[jinglesthula]

+1 (two squares is better than three, IMO, especially at smaller sizes)

[dincozdemir]

+1

[glueball]

+1

[jakubste]

+1

[jonatanskogsfors]

+1

[clabnet]

+1

[ulybu]

Personally I use this snippet to produce "select all checkbox" :
⚠️ May use pro features

<div style="height: 1em; width: 1em;">
  <i class="far fa-square"            style="position: absolute; top: 0px; left: 0px;"/>
  <i class="fas fa-square fa-inverse" style="position: absolute; top: 2px; left: 2px;"/>
  <i class="far fa-check-square"      style="position: absolute; top: 3px; left: 3px;"/>
  <!--This line for "unselect all" icon
    <i class="far fa-square"      style="position: absolute; top: 3px; left: 3px;"/>
  -->
</div>

[BartusZak]

Thanks man for provided solution.

JSX Bootstrap v4.0

JSX

<div className="selectAllIcons" onClick={() => this.addAllGroups()} title="Wybierz wszystko">
   <i class="fa fa-square"            style={{position: "absolute", top: "0px", left: "0px"}}/>
    <i class="fa fa-square fa-inverse" style={{position: "absolute", top: "2px", left: "2px"}}/>
    <i class="fa fa-check-square"      style={{position: "absolute", top: "3px", left: "3px"}}/>
</div>
 <div className="unSelectAllIcons" onClick={() => this.generatingGroups()} title="Odznacz wszystko">
      <i class="fa fa-square"            style={{position: "absolute", top: "0px", left: "0px"}}/>
      <i class="fa fa-square fa-inverse" style={{position: "absolute", top: "2px", left: "2px"}}/>
       <i class="fa fa-check-square"      style={{position: "absolute", top: "3px", left: "3px"}}/>
      <i class="fa fa-square"            style={{position: "absolute", top: "3px", left: "3px"}}/>
</div>

.unSelectAllIcons,
    .selectAllIcons {
        height: 1em;
        width: 1em;
        position: relative;
        display: inline-block;
        margin: 0 20px 0 20px;
}

PREVIEW