# Select

<div class="field">
    <label for="select">Select</label>
    <div class="select">
        <select name="select" id="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>

<div class="field">
    <label for="select">Multiple select</label>
    <div class="select is-multiple">
        <select name="select" id="select" multiple>
            <option>Apple</option>
            <option>Pear</option>
            <option>Peach</option>
            <option>Lemon</option>
            <option>Pineapple</option>
        </select>
    </div>
</div>

<div class="field">
    <label>Default</label>
    <div class="select">
        <select name="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label>Primary</label>
    <div class="select is-primary">
        <select name="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label>Accent</label>
    <div class="select is-accent">
        <select name="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label>Accent alt</label>
    <div class="select is-accent-alt">
        <select name="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label>Success</label>
    <div class="select is-success">
        <select name="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label>Light success</label>
    <div class="select is-light-success">
        <select name="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label>Warning</label>
    <div class="select is-warning">
        <select name="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label>Light warning</label>
    <div class="select is-light-warning">
        <select name="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label>Danger</label>
    <div class="select is-danger">
        <select name="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label>Light danger</label>
    <div class="select is-light-danger">
        <select name="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label>Info</label>
    <div class="select is-info">
        <select name="select">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>

<div class="field">
    <label for="select_default">Default</label>
    <div class="select">
        <select name="select" id="select_default">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label for="select_large">Large</label>
    <div class="select is-large">
        <select name="select" id="select_large">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label for="select_fullwidth">Full width</label>
    <div class="select is-fullwidth">
        <select name="select" id="select_fullwidth">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>

<div class="field">
    <label for="select_disabled">Disabled select</label>
    <div class="select">
        <select name="select" id="select_disabled" disabled>
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>
<div class="field">
    <label for="select_loading">Loading</label>
    <div class="select is-loading">
        <select name="select_loading" id="select_loading">
            <option>Select dropdown</option>
            <option>With some options</option>
        </select>
    </div>
</div>