Object | Fill

Object | Fill | Text Colors

 
 
 
HTML
<div class="ss-c-grid">
            <label>.object--fill--text_primary</label>
            <div class="ss-c-swatch ss-c-object--fill--text_primary">&nbsp;</div>
            <label>.object--fill--text_secondary</label>
            <div class="ss-c-swatch ss-c-object--fill--text_secondary">&nbsp;</div>
            <label>.object--fill--text_tertiary</label>
            <div class="ss-c-swatch ss-c-object--fill--text_tertiary">&nbsp;</div>
        </div>

Object | Fill | Line Colors

 
 
 
HTML
<div class="ss-c-grid">
            <label>.object--fill--line_primary</label>
            <div class="ss-c-swatch ss-c-object--fill--line_primary">&nbsp;</div>
            <label>.object--fill--line_secondary</label>
            <div class="ss-c-swatch ss-c-object--fill--line_secondary">&nbsp;</div>
            <label>.object--fill--line_tertiary</label>
            <div class="ss-c-swatch ss-c-object--fill--line_tertiary">&nbsp;</div>
        </div>

Object | Fill | Fill Colors

 
 
 
HTML
<div class="ss-c-grid">
            <label>.object--fill--fill_primary</label>
            <div class="ss-c-swatch ss-c-object--fill--fill_primary">&nbsp;</div>
            <label>.object--fill--fill_secondary</label>
            <div class="ss-c-swatch ss-c-object--fill--fill_secondary">&nbsp;</div>
            <label>.object--fill--fill_tertiary</label>
            <div class="ss-c-swatch ss-c-object--fill--fill_tertiary">&nbsp;</div>
        </div>

Object | Fill | Accent Colors

 
 
 
HTML
<div class="ss-c-grid">
            <label>.object--fill--accent_primary</label>
            <div class="ss-c-swatch ss-c-object--fill--accent_primary">&nbsp;</div>
            <label>.object--fill--accent_secondary</label>
            <div class="ss-c-swatch ss-c-object--fill--accent_secondary">&nbsp;</div>
            <label>.object--fill--accent_tertiary</label>
            <div class="ss-c-swatch ss-c-object--fill--accent_tertiary">&nbsp;</div>
        </div>

Object | Fill | State Colors

 
 
 
 
 
 
 
 
 
 
HTML
<div class="ss-c-grid">
            <label>.object--fill--state_visited</label>
            <div class="ss-c-swatch ss-c-object--fill--state_visited">&nbsp;</div>
            <label>.object--fill--state_focus</label>
            <div class="ss-c-swatch ss-c-object--fill--state_focus">&nbsp;</div>
            <label>.object--fill--state_hover</label>
            <div class="ss-c-swatch ss-c-object--fill--state_hover">&nbsp;</div>
            <label>.object--fill--state_active</label>
            <div class="ss-c-swatch ss-c-object--fill--state_active">&nbsp;</div>
            <label>.object--fill--state_link</label>
            <div class="ss-c-swatch ss-c-object--fill--state_link">&nbsp;</div>
            <label>.object--fill--state_enabled</label>
            <div class="ss-c-swatch ss-c-object--fill--state_enabled">&nbsp;</div>
            <label>.object--fill--state_disabled</label>
            <div class="ss-c-swatch ss-c-object--fill--state_disabled">&nbsp;</div>
            <label>.object--fill--state_current</label>
            <div class="ss-c-swatch ss-c-object--fill--state_current">&nbsp;</div>
            <label>.object--fill--state_checked</label>
            <div class="ss-c-swatch ss-c-object--fill--state_checked">&nbsp;</div>
            <label>.object--fill--state_invalid</label>
            <div class="ss-c-swatch ss-c-object--fill--state_invalid">&nbsp;</div>
            <label>.object--fill--state_muted</label>
            <div class="ss-c-swatch ss-c-object--fill--state_muted">&nbsp;</div>
        </div>

Object | Fill | Log Colors

 
 
 
 
 
 
 
 
 
 
 
 
HTML
<div class="ss-c-grid">
            <label>.object--fill--log_trace</label>
            <div class="ss-c-swatch ss-c-object--fill--log_trace">&nbsp;</div>
            <label>.object--fill--log_debug</label>
            <div class="ss-c-swatch ss-c-object--fill--log_debug">&nbsp;</div>
            <label>.object--fill--log_success</label>
            <div class="ss-c-swatch ss-c-object--fill--log_success">&nbsp;</div>
            <label>.object--fill--log_info</label>
            <div class="ss-c-swatch ss-c-object--fill--log_info">&nbsp;</div>
            <label>.object--fill--log_notice</label>
            <div class="ss-c-swatch ss-c-object--fill--log_notice">&nbsp;</div>
            <label>.object--fill--log_warning</label>
            <div class="ss-c-swatch ss-c-object--fill--log_warning">&nbsp;</div>
            <label>.object--fill--log_audit</label>
            <div class="ss-c-swatch ss-c-object--fill--log_audit">&nbsp;</div>
            <label>.object--fill--log_error</label>
            <div class="ss-c-swatch ss-c-object--fill--log_error">&nbsp;</div>
            <label>.object--fill--log_security</label>
            <div class="ss-c-swatch ss-c-object--fill--log_security">&nbsp;</div>
            <label>.object--fill--log_critical</label>
            <div class="ss-c-swatch ss-c-object--fill--log_critical">&nbsp;</div>
            <label>.object--fill--log_alert</label>
            <div class="ss-c-swatch ss-c-object--fill--log_alert">&nbsp;</div>
            <label>.object--fill--log_emergency</label>
            <div class="ss-c-swatch ss-c-object--fill--log_emergency">&nbsp;</div>
        </div>