This is a sample page to demonstrate various HTML elements and their styling.
Below are examples of headings, text formatting, lists, tables, and forms.
| Variable | Swatch | Hex | RGBA |
|---|---|---|---|
| $background | #514841 | rgba(81, 72, 65, 1) | |
| $primary | #e9e2d8 | rgba(233, 226, 216, 1) | |
| $secondary | #9d9b8e | rgba(157, 155, 142, 1) | |
| $highlight | #f5f1d5 | rgba(245, 241, 213, 1) | |
| $shadow | #e0e6ee14 | rgba(224, 230, 238, 0.08) | |
| $shadow-light | #e0e6ee1a | rgba(224, 230, 238, 0.10) | |
| $accent-colors[1] | #036e85 | rgba(3, 110, 133, 1) | |
| $accent-colors[2] | #6c7843 | rgba(108, 120, 67, 1) | |
| $accent-colors[3] | #b5b058 | rgba(181, 176, 88, 1) | |
| $accent-colors[4] | #e2b248 | rgba(226, 178, 72, 1) | |
| $accent-colors[5] | #cc7a3f | rgba(204, 122, 63, 1) | |
| $accent-colors[6] | #c35630 | rgba(195, 86, 48, 1) |
Heading Level 1
Heading Level 2
Heading Level 3
Heading Level 4
Heading Level 5
Heading Level 6
This is a
bold
word, and this is an
italic
word. Here’s some
underlined
text, and some
strikethrough.
Highlighted text and a small note.
This is superscript and this is subscript.
This is a blockquote. It should stand out from normal text. Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sint quibusdam illo illum iure modi aspernatur at quidem reprehenderit culpa sit. Voluptates odit, ipsum sed veniam maiores modi? Error, rerum quam.
This is a link to nowhere.
Inline code is useful for small code references.
// Code block function helloWorld() { console.log("Hello,
world!"); }
- Unordered List Item 1
- Level 2
- Level 3
- Level 2
- Unordered list item 2
- Unordered list item 3
- Ordered list item 1
- Ordered list item 2
- Ordered list item 3
- Definition Term
- Definition Description
| Header 1 | Header 2 | Header 3 | Header 4 |
|---|---|---|---|
| Row 1, Col 1 | Row 1, Col 2 | Row 1, Col 3 | Row 1, Col 4 |
| Row 2, Col 1 | Row 2, Col 2 | Row 2, Col 3 | Row 2, Col 4 |
| Row 3, Col 1 | Row 3, Col 2 | Row 3, Col 3 | Row 3, Col 4 |
| Row 4, Col 1 | Row 4, Col 2 | Row 4, Col 3 | Row 4, Col 4 |
| Table Footer: Summary or totals go here | |||