Toggle Styles

Active Inactive
                        <div class="toggle">
                            <label class="toggle__label" for="toggle">Toggle Label</label>
                            <div class="toggle__input">
                                <input type="checkbox" name="#NAME" value="#VALUE" id="toggle"/>
                                <div class="toggle__track">
                                    <div class="toggle__wrap">
                                        <span class="toggle__option">Active</span>
                                        <span class="toggle__option">Inactive</span>
                                    </div>
                                </div>
                                <span class="toggle__switch"></span>
                            </div>
                        </div>
                    

Toggle Documentation

Use

Keep text length to one-two words