Capital Framework is divided into a series of components. These components can be used individually, but are designed to work together. For information on how to get started using Capital Framework, please read the Getting Started page.

cf-core

cf-core contains core styles for starting a Capital Framework project. It includes Normalize.css, variables, media query and utility mixins, class utilities, typography, and standard base styling.

cf-buttons

cf-buttons contains button styles including default, secondary, destructive, disabled, super, and compound buttons, button links, buttons with icons, and button groups.

cf-expandables

cf-expandables contains a flexible show/hide component.

cf-forms

cf-forms contains enhanced form styles including inputs, input states, and grouped form styles.

cf-grid

cf-grid contains a Less-based CSS3 grid system that encourages semantic HTML.

cf-icons

cf-icons contains a custom icon font and useful CSS styles for working with the icons.

cf-layout

cf-layout contains a set of HTML & CSS layout helpers, such as common layout patterns and dividers.

cf-pagination

cf-pagination contains basic pagination styling for working with multipage displays such as search results or blog archives.