Knockout is a CSS framework for Webflow created by the folks at Edgar Allan.

Table of Contents

  1. Knockout Setup
    1. Headlines
    2. Text
    3. Rich Text
    4. Colors
    5. Button & Links
  2. Layout
    1. Columns
    2. Padding
    3. Margins
    4. Flex
  3. Objects
    1. Images
    2. Icons
    3. Forms
    4. Misc Objects
  4. Modifiers
  5. Components Library
  6. Scripts

Color Quick Setup

Edit the color in the Webflow palette, not the class.

Headlines Quick Setup

Make sure to check all headline classes across all viewports. Tablet classes are tertiary color & mobile classes are quaternary color.

Heading

Heading

Heading

Heading

Heading
Heading
Tablet viewport icon.
More classes available at tablet viewport

Heading

Heading

Heading

Heading

Heading
Heading
Mobile viewport icon.
More classes available at mobile viewport

Heading

Heading

Heading

Heading

Heading
Heading

Updates

v1.0.3

  • Added Font Awesome 6 css as an option to upgrade Icons to this Font Awesome version.

v1.0.2

  • Updated page structure reducing the Styleguide pages.
    Knockout Setup now includes headlines, text, rich text, colors, buttons and links.
    Images and Icons are together within the same page.
    Containers and Lists are together on a page called Misc Objects.
    Created a new page for Forms component.
    Modifiers and Text Modifiers are together in the same page, called Modifiers.
  • Body text support added to Large Viewport Type embed
  • Component Library folder has been added and all the components have been collected in the Component Library pages.
  • Set all the Styleguide and Component Library pages as noindex

v1.0.1

  • Updated X padding classes to avoid conflicts.
 Created by Edgar Allan. 
Made in Atlanta. ©20xx

This work is licensed under CC BY-SA 4.0