Elements Page
Header 1 Default | Accent | Bold
Header 1 Default
Header 1 Accent
Header 1 Bold
Header 2 Default | Accent | Bold
Heading 2 Default
Heading 2 Accent
Heading 2 Bold
Header 3 Default | Accent | Bold
Heading 3 Default
Heading 3 Accent
Heading 3 Bold
Header 4 Default | Accent | Bold
Heading 4 Default
Heading 4 Accent
Heading 4 Bold
Header 5 Default | Accent | Bold
Heading 5 Default
Header 1-6 & Paragraph
Heading 1 Example
Heading 2 Example
Heading 3 Example
Heading 4 Example
Heading 5 Example
Heading 6 Example
Body TextThis is a normal paragraph. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla eu risus vel libero scelerisque ultricies. Sed ac turpis faucibus, rutrum urna sit amet, scelerisque est. Aliquam ultricies sapien dignissim viverra rhoncus. Pellentesque ac scelerisque turpi.
This is a Large paragraph. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla eu risus vel libero scelerisque ultricies. Sed ac turpis faucibus, rutrum urna sit amet, scelerisque est. Aliquam ultricies sapien dignissim viverra rhoncus. Pellentesque ac scelerisque turpi.
This is a small paragraph. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla eu risus vel libero scelerisque ultricies. Sed ac turpis faucibus, rutrum urna sit amet, scelerisque est. Aliquam ultricies sapien dignissim viverra rhoncus. Pellentesque ac scelerisque turpi.
This text is bold
This text is italic
This text is underline
Blockquote
We need to remember what’s important in life: friends, waffles, work. Or waffles, friends, work. Doesn’t matter, but work is third.
— Leslie Knope
This is a subscript and a superscript
This is a strikethrough.
This is a mark tag
This is a preformatted text element.
Unordered List:
- Item One
- Item Two
- Sub Item 1
- Sub Item 2
- Item Three
Ordered List
- Item
- Item
- Sub Item
- Sub Item
- Item
Roman Numbered List
- One
- Two
- Sub One
- Sub Two
- Three
- Four
Mixed Numbered List Example 1:
- One
- Two
- Sub One
- Sub Two
- Three
- Four
Mixed Numbered List Example 2:
- One
- Two
- Sub One
- Sub Two
- Three
- Four
This is an H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vitae purus lorem. Fusce porta id dolor a hendrerit. Vivamus feugiat interdum ante ut lobortis. Fusce tempus dictum magna, at congue augue iaculis at. Cras eu lectus ut massa consectetur placerat ac in mauris. Etiam auctor ligula non purus vestibulum vestibulum.Cras scelerisque ligula orci, eu varius mauris scelerisque sed. Fusce sed leo ac massa cursus dapibus ac vitae lectus. — Name
This is an H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vitae purus lorem. Fusce porta id dolor a hendrerit. Vivamus feugiat interdum ante ut lobortis. Fusce tempus dictum magna, at congue augue iaculis at. Cras eu lectus ut massa consectetur placerat ac in mauris. Etiam auctor ligula non purus vestibulum vestibulum. Lorem ipsum dolor sit amet- Vestibulum eget volutpat justo. Mauris eleifend rutrum orci, sit amet condimentum est fermentum et.
- Duis lobortis dui eu dolor venenatis, ullamcorper scelerisque tortor pretium. Suspendisse potenti. Suspendisse eget justo nunc.
Buttons
Form
"*" indicates required fields
COlors:
- #C3DD22 – Primary (Buttons, highlights, CTAs)
- #496D89 – Secondary (Navigation, headings, links, hover states, accents)
- #000000 – Text (Titles, Headings, strong anchors)
- #52585B – Text (Body, legal text)
- #E5E5EA – Light Grey (Tables, inputs, dividers)
- #A2AAAD – Grey (Structural elements, muted UI)
- #1C1C1E – Charcoal (Footer backgrounds, dark sections)
- #FFFFFF – White
EMAIL:
|
Chris Westphal (he/him) PROPRIETOR | WESTPHALSOLUTIONS.COM PHILADELPHIA | (215) 792-4048 
|