Better default styles for common input elements.
formbase eliminates cross browser bugs, inconsistencies across systems and applies a beautiful default styling to several input elements.
Name | Description | Link |
---|---|---|
Default | Includes all features. | Try it on CodePen |
- Works in all modern browsers and IE11
- No JavaScript, just CSS
- Works with inputs, textareas, selects, checkboxes and radio buttons
- Consistent styling across browsers
- Zero dependencies
We recommend installing formbase using npm or yarn.
npm install formbase
yarn add formbase
Include the CSS file in the head
…
<link rel="stylesheet" href="dist/formbase.min.css">
…or import the SASS file directly:
@import 'src/styles/main';
<input class="input" type="text">
<textarea class="input" rows="8" cols="40"></textarea>
<select class="select">
<option selected disabled>-</option>
<option value="one">One</option>
<option value="two">Two</option>
</select>
<div class="control">
<input class="control__input" id="Radio" type="radio">
<label class="control__label" for="Radio">Radio</label>
</div>
<div class="control">
<input class="control__input" id="checkbox" type="checkbox">
<label class="control__label" for="checkbox">Checkbox</label>
</div>
Import src/styles/main.scss
directly to customize the look of formbase: