This demo page details a select set of elements that are meant to show off Simple.css’s styling, and provide HTML to help you get started easily. If you want a comprehensive demonstration of elements that may or may not be styled by Simple.css, please see our test page .
This page is a demonstration of the elements that can be formatted using Simple.css. Each section includes a code block on how to include it in your site’s design.
This may be a little basic for some people, but I wanted the barrier for entry to be as low as possible for this project.
This may be a little basic for some people, but I wanted the barrier for entry to be as low as possible for this project.
Basic Typography
All the typography of Simple.css uses
rem
for sizing. This means that accessibility is maintained for those who change their browser font size. The
body
element has a size of
1.15rem
which makes all the standard font sizes slightly larger. This equates to
18.4px
for paragraph text, instead of the standard
16px
Heading 1
3rem
Heading 2
2.6rem
Heading 3
2rem
Heading 4
1.44rem
Heading 5
1.15rem
Sample code
Links & Buttons
Links are formatted very simply on Simple.css (shock horror). They use the accent CSS variable and are underlined. There is a effect that removes the underline.
Table view with Simple.css
| Code | Name |
|---|---|
| 02 | Albacete |
| 03 | Alicante/Alacant |
| 04 | Almería |
| 01 | Araba/Álava |
| 33 | Asturias |
| 05 | Ávila |
| 06 | Badajoz |
| 07 | Balears, Illes |
| 08 | Barcelona |
| 48 | Bizkaia |
| 09 | Burgos |
| 10 | Cáceres |
| 11 | Cádiz |
| 39 | Cantabria |
| 12 | Castellón/Castelló |
| 13 | Ciudad Real |
| 14 | Córdoba |
| 15 | Coruña, A |
| 16 | Cuenca |
| 20 | Gipuzkoa |
| 17 | Girona |
| 18 | Granada |
| 19 | Guadalajara |
| 21 | Huelva |
| 22 | Huesca |
| 23 | Jaén |
| 24 | León |
| 25 | Lleida |
| 27 | Lugo |
| 28 | Madrid |
| 29 | Málaga |
| 30 | Murcia |
| 31 | Navarra |
| 32 | Ourense |
| 34 | Palencia |
| 35 | Palmas, Las |
| 36 | Pontevedra |
| 26 | Rioja, La |
| 37 | Salamanca |
| 38 | Santa Cruz de Tenerife |
| 40 | Segovia |
| 41 | Sevilla |
| 42 | Soria |
| 43 | Tarragona |
| 44 | Teruel |
| 45 | Toledo |
| 46 | Valencia/València |
| 47 | Valladolid |
| 49 | Zamora |
| 50 | Zaragoza |
| 51 | Ceuta |
| 52 | Melilla |