Skip to content
A lightweight CSS library that provides a set of predesigned elements useful for rapid web development. It follows the latest skeuomorphic design trends, using bright colors and subtle shadows for some depth.
CSS HTML
Branch: master
Clone or download

Latest commit

Latest commit 57bb3c8 Mar 27, 2020

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
Images
css
src
LICENSE
README.md
index.html

README.md

Skeuos CSS library

Skeuos CSS is licensed under the MIT License

Skeuos CSS Palette

  • #265ab1 #265AB1

  • #367bf0 #367bf0

  • #19a187 #19A187

  • #d41919 #E43030

  • #b8174c #B8174C

  • #8c42ab #8C42AB


Paper class

    <div class="paper">
    </div>

Shadow

    <div class="with-shadow">
    </div>

Heading 1

 <h1>Heading 1</h1>

Heading 2

  <h2>Heading 2</h2>

Heading 3

  <h3>Heading 3</h3>

Heading 4

  <h4>Heading 4</h4>
Heading 5
  <h5>Heading 5</h5>
Heading 6
  <h6>Heading 6</h6>

Selectable text

    <div class="selectable">
    </div>

Links

    <a href="#">My link</a>

Horizontal rule

    <hr>

Form elements

Input
  <input type="text">
Select
<select>
    <option>Level 1</option>
    <option>Level 2</option>
</select>
Textarea
  <textarea></textarea>
Checkbox
    <label>
        <input type="checkbox" name="my-checkbox" checked> Select me
    </label>
    <label>
        <input type="checkbox" name="my-checkbox"> Select me
    </label>
Input Radio
    <label>
        <input type="radio" name="my-input-radio" checked> Select me
    </label>
    <label>
        <input type="radio" name="my-input-radio"> Select me
    </label>
Checktext
    <label class="checktext">
        <input type="radio" name="my-checktext" checked>
        <span>09:00</span>
    </label>
    <label class="checktext">
        <input type="radio" name="my-checktext" >
        <span>09:30</span>
    </label>
Switch
    <label class="switch">
        <input type="checkbox" name="my-switch">
        <div></div>
    </label>
Buttons
  <button class="blue-button">save</button>
  <button class="green-button">enter</button>
  <button class="red-button">exit</button>
  <button>Send</button>



You can’t perform that action at this time.