Button Group Styles

Button Group - Radio

One Two Three Four

                        <div aria-label="buttonGroupLabelOne" role="group" class="form__button-group">
                            <label class="form__button-group__button">
                                <input type="radio" name="group" checked/>
                                <span>One</span>
                            </label>
                            <label class="form__button-group__button">
                                <input type="radio" name="group" />
                                <span>Two</span>
                            </label>
                            <label class="form__button-group__button">
                                <input type="radio" name="group" />
                                <span>Three</span>
                            </label>
                            <label class="form__button-group__button">
                                <input type="radio" name="group" disabled/>
                                <span>Four</span>
                            </label>
                        </div>

Button Group - Checkbox

One Two Three Four

                        <div aria-label="buttonGroupLabelTwo" role="group" class="form__button-group">
                            <label class="form__button-group__button">
                                <input type="checkbox" name="check" checked/>
                                <span>One</span>
                            </label>
                            <label class="form__button-group__button">
                                <input type="checkbox" name="check" />
                                <span>Two</span>
                            </label>
                            <label class="form__button-group__button">
                                <input type="checkbox" name="check" />
                                <span>Three</span>
                            </label>
                            <label class="form__button-group__button">
                                <input type="checkbox" name="check" disabled/>
                                <span>Four</span>
                            </label>
                        </div>