Legend indicator

A component to indicate properties of elements.
Examples

Preview
HTML
Default
Primary
Info
Danger
Success
Warning
Navy
Dark
Light
                    
                      <div class="row">
                        <div class="col-auto">
                          <span class="legend-indicator"></span>Default
                        </div>
                        <div class="col-auto">
                          <span class="legend-indicator bg-primary"></span>Primary
                        </div>
                        <div class="col-auto">
                          <span class="legend-indicator bg-info"></span>Info
                        </div>
                        <div class="col-auto">
                          <span class="legend-indicator bg-danger"></span>Danger
                        </div>
                        <div class="col-auto">
                          <span class="legend-indicator bg-success"></span>Success
                        </div>
                        <div class="col-auto">
                          <span class="legend-indicator bg-warning"></span>Warning
                        </div>
                        <div class="col-auto">
                          <span class="legend-indicator bg-navy"></span>Navy
                        </div>
                        <div class="col-auto">
                          <span class="legend-indicator bg-dark"></span>Dark
                        </div>
                        <div class="col-auto">
                          <span class="legend-indicator bg-light"></span>Light
                        </div>
                      </div>