Color Variable Guide - Type

Follow

This article is part of the Color Variable Guide. The Type section of the Theme control panel contains color customization options for the typography of your portal such as body text, banner text, and hyperlinks.

In This Article

Banner & Button Text

UI elements affected by this color variable are shown in pink

color-variables-0130.png

Login

  • Button text

color-variables-0089-01.png

Header

  • Shopping Cart Count number
  • Shopping Cart Icon
  • Shopping Cart menu open:
    • Icon
    • Sub Total text
    • Button text
  • Main Menu open:
    • Icon
    • You are text
    • Username text
  • Inbox open:
    • Priority Messages text
    • Priority Messages count
    • System Messages text
    • System Messages count
    • View All Messages text

color-variables-0141.pngcolor-variables-0140.pngcolor-variables-0134.png

Dashboard

  • Welcome Tile > Welcome text
  • Large Tiles:
    • List Item description
    • Button text
  • Cards:
    • Button text
    • Button Icon
    • Hat Icon
    • ILC Session count
    • Bundle count

color-variables-0190.pngcolor-variables-0133.pngcolor-variables-0131.png

Catalog / My Courses

  • Banner:
    • Title
    • Back Button Icon
    • Category folder item count
  • Cards:
    • Button text
    • Button Icon
    • Hat Icon
  • Detailed View:
    • Button text
    • Button Icon
    • Hat Icon
    • Session Calendar Date Month/Year/Expires text
    • List View > button text
  • Calendar View:
    • Calendar Month/Year button text
    • ILC button text
    • ILC button Icon
    • ILC Session Calendar Date Month/Year text

color-variables-0138-01.pngcolor-variables-0138.pngcolor-variables-0137.pngcolor-variables-0136.pngcolor-variables-0132.pngcolor-variables-0135.png

Course Details

  • Banner:
    • Course Name text
    • Course Type text
    • Button text
    • Button Icon
    • Ratings Count
  • ILC Button text
  • ILC Button Icon
  • ILC Session Calendar Date Month/Year text
  • Lessons button text
  • Comments Tab button text
  • Resources Tab button text

color-variables-0143.pngcolor-variables-0153.pngcolor-variables-0152.pngcolor-variables-0151.png

Profile

  • My Activity Tab > title & button text
  • Edit Profile Tab > title & button text

color-variables-0139.pngcolor-variables-0142.png

Transcript

  • Banner title & button text
  • Status Pills

color-variables-0144.png

Leaderboards

  • Banner:
    • Title
    • Back button Icon
  • View Button text
  • Rank number
  • Username text
  • Points number
  • Page Size button number

color-variables-0146.pngcolor-variables-0145.png

Page Banner

color-variables-0149.pngcolor-variables-0150.pngcolor-variables-0148.png


Title & Body Text

UI elements affected by this color variable are shown in blue

color-variables-0158.png

Login / Sign Up

  • Titles
  • Instructions
  • Form Field Hints

color-variables-0189.pngcolor-variables-0176.pngcolor-variables-0175.pngcolor-variables-0236.png

Header

  • Shopping Cart:
    • Course Name
    • Course Type
    • Course Price
  • Messages Inbox:
    • No messages text
    • Message Title
    • View All Button

color-variables-0166-2.pngcolor-variables-0186.png

Dashboard

  • Cards:
    • Course Name (Dark Version)
    • Course Type

color-variables-0159.png

Catalog / My Courses

  • Filter Sidebar:
    • Titles
    • Field text (Dark Version)
    • Checkbox Label (Dark Version)
    • Cards View:
    • Course Name (Dark Version)
    • Course Type
  • Detail View:
    • Course Name (Dark Version)
    • Course Type
    • Course Description text
    • Tags & Competencies text
    • ILC session info
  • List View:
    • Table Column Titles (Dark Version)
    • Course Names
    • Course Type
  • Calendar View:
    • Calendar date numbers
    • Month & Year text (Dark Version)
    • ILC session info
  • Sort Field text (Dark Version)
  • Category Folder Name
  • Category Sub-category Breadcrumbs text

color-variables-0164-2.pngcolor-variables-0164.pngcolor-variables-0163.pngcolor-variables-0162.pngcolor-variables-0161.pngcolor-variables-0160.png

Course Details

  • Tab Bar > Titles (Dark Version)
  • Course Description (Dark Version)
  • Course Content Title (Dark Version)
  • Chapter Title
  • Lesson:
    • Name (Dark Version)
    • Description (Dark Version)
  • Resources:
    • Title (Dark Version)
    • Name (Dark Version)
    • Description (Dark Version)
  • Sidebar:
    • Section Titles
    • Links
  • Session:
    • Title (Dark Version)
    • Date & Time (Dark Version)
    • Description (Dark Version)
    • Details (Dark Version)
  • Comments:
    • Title (Dark Version)
    • WYSIWYG Editor text (Dark Version)
    • Username (Dark Version)
    • Message text (Dark Version)
    • Reply Link (Dark Version)
    • Date Time
    • Helpful Count (Dark Version)

color-variables-0193.pngcolor-variables-0179.pngcolor-variables-0178.pngcolor-variables-0177.png

Transcript

  • Section Anchor Links (Dark Version)
  • User Info
  • Section Titles (Dark Version)
  • Table Titles (Dark Version)
  • Table text (Dark Version)

color-variables-0165.png

Profile

  • Tab Bar Titles (Dark Version)
  • User Name and Info (Dark Version)
  • My Activity:
    • Table Column Titles (Dark Version)
    • Summary (Dark Version)
    • Points (Dark Version)
    • Date (Dark Version)
  • Inbox:
    • Message Title (Dark Version)
    • Message Subject preview (Dark Version)
    • Message modal text (Dark Version)
  • Edit Profile:
    • Titles (Dark Version)
    • Form Field text
    • Form Field Hints

color-variables-0188.pngcolor-variables-0187.pngcolor-variables-0168.pngcolor-variables-0166.pngcolor-variables-0167.png

 

Leaderboard

  • Titles (Dark Version)
  • Date Range (Dark Version)
  • Description (Dark Version)
  • Summary Info Titles (Dark Version)
  • Table Titles (Dark Version)
  • Usernames (Dark Version)

color-variables-0174.pngcolor-variables-0173.png

Polls & Surveys

  • Titles (Dark Version)
  • Date (Dark Version)
  • Votes (Dark Version)
  • Option text (Dark Version)

color-variables-0183.png

FAQ

  • Questions (Dark Version)
  • Answers (Dark Version)

color-variables-0180.png

News

  • Title (Dark Version)
  • Author (Dark Version)
  • Date (Dark Version)
  • Content (Dark Version)

color-variables-0182.pngcolor-variables-0181.png

Search

  • Header Search Box hint text
  • No results message (Dark Version)
  • Filter Sidebar

color-variables-0192.pngcolor-variables-0237.png

Language Selector

color-variables-0238.png

Footer Copyright

  • Absorb LMS text
  • Copyright and Build info (Dark Version)

color-variables-0239.png

Shopping Cart

  • Numerical Progress Indicator (Dark Version)
  • Default Course Icon (Dark Version)
  • Table Titles (Dark Version)
  • Course Type (Dark Version)
  • Subtotal (Dark Version)
  • Price (Dark Version)
  • Coupon Code text (Dark Version)
  • Form Feild text (Dark Version)
  • Invoice text (Dark Version)

color-variables-0172.pngcolor-variables-0171.pngcolor-variables-0170.pngcolor-variables-0169.png


Hyperlinks

UI elements affected by this color variable are shown in orange

color-variables-0195.png

Login

  • Forgot Password link

color-variables-0196.png

Profile

  • Tab Bar > Active Title
  • Inbox:
    • Active Messages Tab text
    • Dismiss All link

color-variables-0197.pngcolor-variables-0199.pngcolor-variables-0198.png

Catalog / My Courses

  • Detailed Views:
    • Tag Pills
    • Competency Links

color-variables-0203.pngcolor-variables-0200.png

Course Details

  • Sidebar > Tag Pills

color-variables-0205.pngcolor-variables-0201.png

Leaderboard

  • Active Tab text

color-variables-0204.png

Shopping Cart

  • Continue Shopping link
  • Course Name
  • Previous link
  • Edit link

color-variables-0206.pngcolor-variables-0208.pngcolor-variables-0207.png

Published on
Have more questions? Submit a request

0 Comments

Article is closed for comments.