Project X

Welcome to Project X! It doesn’t have a fancy name just yet, but that’s only because it’s still in progress and to be honest, I’m still waiting for something clever to come to me!

When Project X is complete, it will be a fully customizable developer-ready open source front end framework (phew, lot’s of adjectives!) to assist in building beautiful responsive and accessible websites. Along with the framework will come several beautiful and accessible WordPress themes that will be using the framework.

Colors

Coming soon...

Icons

Coming soon...

Typography

Theme-specific font styles and declarations.

Heading 1

style="font-size: 6rem; font-weight: 800; margin: 0 0 1rem 0;"

Heading 2

style="font-size: 2rem; font-weight: 600; margin: 0.75rem 0;"

Heading 3

style="font-size: 1.5rem; font-weight: 800; margin: 0.5rem 0;"

Heading 4

style="font-size: 1.25rem; font-weight: 600; margin: 0.15rem 0;"

Heading 5

style="font-size: 1rem; font-weight: 700; margin: 0.15rem 0;"

Heading 6

style="font-size: 0.9rem; font-weight: 800; margin: 0.15rem 0;"

This is a paragraph with dummy text and a link. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

style="font-size: 1rem; font-weight: 400; margin: 0.25rem 0; line-height: 1.25"

Alerts

Alert blocks for user notifications (role="alert").

Alert Default

Alert Success

Alert Warning

Alert Danger

Blocks

Coming soon...

Buttons

The-based solid and outlined sets of buttons for use across the site.

State: Disabled

Cards

Theme-based cards for built out lists, posts, and more! This section is still under construction.

Full Card w/Button

Card Subtitle

Full Card w/Button

Card Subtitle

Simple Card

Card Subtitle

Simple Card

Card Subtitle

Simple Card

Card Subtitle

Accordions

Elegant yet simply designed accordion blocks for text you want your users to be able to control the visibility of.

Header

This is where the content goes!

Header

This is where the content goes!

Header

This is where the content goes!

Dropdowns

Coming soon...

Forms

Text here...

Default Form

First Name

First name only.

Last Name

This field is required.

Address Line 1

Address Line 2

City

State

Zip Code

I agree to the terms and conditions. I agree to the terms and conditions. I agree to the terms and conditions. I agree to the terms and conditions. I agree to the terms and conditions.

Yes

Project X

Colors

Icons

Typography

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Alerts

Blocks

Buttons

State: Disabled

Cards

Full Card w/Button

Full Card w/Button

Full Card w/Button

Simple Card

Simple Card

Simple Card

Full Button/Link Card

Full Button/Link Card

Full Button/Link Card

Accordions

Header

Header

Header

Dropdowns

Forms

Default Form

Form Styles

Embedded Labels (class="embedded-labels")

Floating Labels (class="floating-labels")