Emblems
Sajabé Design System
Emblems are site-specific visual signifiers. An emblem is typically a small supporting design element which reflects the brand and which is infused into elements and components to create a cohesive aesthetic for the system. Emblems help to prevent your system from looking generic and they increase the visual rhyme of your system
Borders, Bars, and Tabs
Unlike dividers, borders are not intended to divide sections of main content. They are visual accents and may be used to denote sections of a page, but they should not be used in place of a horizontal rule inline-level element.
Gradient Borders
Gradient Bars
UV Gradient Bars
Patterned Borders
Flags
Flags are rounded corner gradient bars which denote main section headings. Horizontal flags are for content subheadings, usually an h2. Vertical flags are for subheadings within components, such as a tabbed comonent.
Unline vertical borders, flags have a minimum and ideal height of $baseline * 2.
Flowers
Flowers are Sajabé branding elements.