Skip nav to main content.
Mobile App
Find it for free on the App Store.
Get The App
Mobile App
Find it for free on the App Store.
Get The App

Common CSS classes for implementation/design

Most text fields support CSS classes and some HTML elements (ex: span)

Assigning Text Colors

The Codyhouse framework has built-in CSS classes for text color.

This text will inherit the primary color from the theme

This text will inherit the secondary color from the theme

Creating buttons in text fields

Buttons can be created in any field that accepts "a" tags (most body copy)

This is a primary button This is a secondary button This is a tertiary button

Headings

When adding headings to a text field, always use an h level appropriate for document flow. If you need an h2 to have the styles of an h1, you can add a CSS class, "h1," to make the text accessible while inheriting the styles of an h1.

Note: manually setting heading styles may not work predictably correctly in title fields

This h1 will look like an h2

This h2 will look like an h1

This h2 will look like an h3

This h2 will look like an h4

Font size

If you want to make a section of text larger or smaller, you can wrap it in a span with one of the CodyHouse "font-size" classes

This text is normal size This text is larger, and in the primary color

This text is normal size This text is smaller, and in the accent (secondary) color

Hide on different devices

You may want to hide text or elements on different devices. You can do that with the hide@ classes

The text in this box will only show on mobile
The text in this box will only show on desktop