Preview:
:root {
  /* primary colors */
  --primary-color: #45454f;
  --primary-color-hover: #45454fcc;

  /* secondary colors */
  --secondary-color: #45454f;
  --secondary-color-hover: #45454fcc;

  /* aditional colors */
  --tertiary-color: #696969;
  --neutral-color-black: #464145;

  --white: #ffffff;
}

/* ------------------ LOGIN PAGE ------------------ */
/* LOGIN buttons */
a.um_button.btn_idp,
#signup_form #insert_user,
.credentials_content form input[type="submit"],
.um_login_button {
  background-color: var(--primary-color);
  color: #3a94c6;
}

/* LOGIN buttons (HOVER) */
a.um_button.btn_idp:hover,
#signup_form #insert_user:hover,
.credentials_content form input[type="submit"]:hover,
.um_login_button:hover {
  background-color: var(--primary-color-hover);
  color: #91a8c4;
}

/* LOST PASSWORD */
.credentials_content a[class^="lostpassword_link"],
#signup_form > p.signin_now > a {
  color: var(--secondary-color);
  color: #3a94c6;
}

/* LOST PASSWORD (HOVER) */
.credentials_content a[class^="lostpassword_link"]:hover {
  color: var(--secondary-color-hover) !important;
  color: #91a8c4;
}

/* REQUEST AN ACCOUNT */
.join_button {
  color: var(--secondary-color) !important;
  color: #3a94c6;
}

/* REQUEST AN ACCOUNT (HOVER) */
.req_account_container .join_button:hover {
  color: var(--secondary-color-hover) !important;
  color: #91a8c4;
}

/* ------------------ DASHBOARD ------------------ */
/* Hero Image CTA button */
.dashboard-hero .btn--minimal {
  color: #f2f2f2;
  background: #3a94c6;
}

/* Hero Image CTA button (HOVER) */
.dashboard-hero .btn--minimal:hover {
  color: #f2f2f2;
  background: #91a8c4;
}

/* Quick Links Widget text */
.dashboard-quicklinks__links ol li a,
.dashboard-quicklinks__links ol li::before {
  color: #3a94c6;
}

/* View my Channel Manager Widget button */
.dashboard-minimal .btn--minimal--blue {
  margin: 10px;
  border-radius: 3px;
  background: #3a94c6 !important;
  color: #fff;
}

/* View my Channel Manager Widget button (HOVER) */
.dashboard-minimal .btn--minimal--blue:hover {
  color: #fff;
  background: #91a8c4 !important;
}

/*-------------DASHBOARD BUTTONS-------------*/
/* Dashboard Buttons - Icons */
.dashboard-btn__content span {
  color: #3a94c6;
}

/* Dashboard Buttons - Arrows */
.dashboard-btn__content__arrow svg {
  stroke: #3a94c6;
}

/*--Dashboard Buttons - Title color (right of icon)--*/
.dashboard-btn__content__category {
  color: #3a94c6;
}

/* Dashboard Buttons - background color (HOVER) */
.dashboard-btn:hover {
  background: #6e83b1;
}

/*-- DB Button Text Hover --*/
.dashboard-btn:hover .dashboard-btn__content span,
.dashboard-btn:hover .dashboard-btn__content__arrow svg,
.dashboard-btn:hover .dashboard-btn__content__category,
.dashboard-btn:hover .dashboard-btn__content__text,
.dashboard-btn:hover .dashboard-btn__content h4 {
  color: #f2f2f2;
  stroke: #f2f2f2;
}

/*---------------------- New and Popular Widget ----------------------*/
/* New and Popular Widget - Text */
.dashboard-popular-new__tab-content ul li::before,
.dashboard-popular-new__tab-content
  ul
  a
  .dashboard-popular-new__tab-content__pane__link
  p,
.dashboard-popular-new__tab-content
  ul
  a
  .dashboard-popular-new__tab-content__pane__views
  p {
  color: #272e40;
}

/* New and Popular Widget - Active Header */
.dashboard-popular-new__tab-row a.active {
  background: #6e83b1;
}

/* New and Popular Widget - Inactive Header */
.dashboard-popular-new__tab-row a {
  background: #6e83b1;
}

/* ----------------------Calendar Widget ----------------------*/
.dashboard-calendar__title a {
  color: var(--primary-color);
}

.dashboard-calendar__event__details .category {
  color: var(--primary-color);
}

/*----------------------Pinned Content----------------------*/
.dashboard-minimal .empty_asset_content h3 {
  color: var(--primary-color);
}

/*--Header initials avatar bckground color--*/
.avatar_small svg rect {
  fill: #272e40;
}

.empty_asset_content h3 {
  color: var(--primary-color);
}

.cta-button-slider__buttons li button {
  background-color: var(--primary-color);
}

/*--View Event button and Update button--*/
.btn,
.btn:link,
.btn:visited,
.ab_settings input[type="submit"] {
  background-image: none !important;
  padding: 10px 20px;
  background-color: var(--primary-color);
}

/*--View Event button and Update button (HOVER)--*/
.btn:hover,
.btn:active,
.ab_settings input[type="submit"]:hover,
.ab_settings input[type="submit"]:active {
  background-color: var(--secondary-color-hover) !important;
}

/*--Event +playbook button (BG) color--*/
.btn.dark,
.btn.dark:link,
.btn.dark:visited {
  background-color: var(--primary-color);
}

/*--Event +playbook button (text HOVER) color--*/
.btn.dark:hover,
.btn.dark:active {
  color: #f2f2f2;
}

/*--Deal header icon text color--*/
.ab_header_btns span.btn_title {
  color: #272e40;
}

/*--Deal header icon color--*/
.ab_header_btns span[class^="icon-"] {
  background-color: #3a94c6;
}

/*--Deal header icon color (HOVER)--*/
.ab_header_btns a:hover span[class^="icon-"] {
  background-color: #3a94c6;
}

/*--Header tab selection color--*/
.tab_nav.horizontal li.active a {
  border-bottom-color: var(--primary-color);
}

/*--Event title color (HOVER)--*/
a:hover .asset_content h3 {
  color: var(--primary-color) !important;
}

/*--S&E filter button text color--*/
#filter_results form input[type="submit"],
.post-type-knowledge-base #searchsubmit {
  background-color: var(--primary-color) !important;
  color: #fff;
}

/*--S&E filter button text color--*/
#filter_results form input[type="submit"]:hover,
.post-type-knowledge-base #searchsubmit:hover {
  background-color: var(--primary-color-hover) !important;
  color: #fff;
}

/*--Default dropdown menu link color--*/
.user_content a:link,
.user_content a:visited,
a.logout_link span[class^="icon-"] {
  color: #4d4d4f;
}

/*--Default dropdown menu icon color--*/
.user_content a span[class^="icon-"] {
  color: #3a94c6;
}

/*--Dropdown link color (HOVER)--*/
.user_content a:hover,
a.logout_link:hover {
  color: #3a94c6;
}

/*--Drop down menu icon color (HOVER)--*/
.user_content a:hover span[class^="icon-"],
a.logout_link:hover span[class^="icon-"] {
  color: #272e40;
}

/*--Bell header icon color--*/
#ab_notifications > a > span {
  color: #6a65ad;
}

/*--Team CoLab header icon color--*/
#ab_colab > a > span {
  color: #3a94c6;
}

#ab_notifications > a:hover > span,
#ab_colab > a:hover > span {
  opacity: 0.7;
}

/*--(/Learn) course percentage text color--*/
.asset a:link,
.asset a:visited {
  color: var(--primary-color);
}

.asset .progress span {
  background: var(--primary-color);
}

/*--System settings active selection color--*/
.content_nav ul li.active a:before {
  background-color: var(--primary-color);
}

/*--Pipeline total value color--*/
.pipeline_summary .flex.pipeline_total {
  background-color: #272e40;
}

/*--Pipeline (Deal details) milestone text--*/
.coach_overview__label {
  color: var(--primary-color);
}

/*--Pipeline (Deal details) milestone outer circle--*/
.status_check.complete .check_holder {
  border-color: var(--primary-color);
}

/*--Pipeline (Deal details) milestone inner circle--*/
.status_bar.complete,
.status_check.complete .check_holder span[class^="icon-"] {
  background-color: var(--primary-color);
}

/*--Pipeline (Deal details) deal info title--*/
.coach_sidebar_title {
  color: var(--primary-color);
}

.coach_team_avatar:hover {
  border-color: var(--primary-color);
}

#body_block > section > div.main_content.wrapper > form > a:hover {
  color: var(--primary-color-blue);
}

.profile_settings #ab_colab {
  color: var(--primary-color);
}

/*--Pinned Icon color--*/
span.icon-pin.pinned {
  color: var(--primary-color);
}

/* Show me How Widget */
#walkme-player
  > div
  > div.walkme-question-mark.walkme-override.walkme-css-reset,
.u-userLauncherColor:not([disabled]) {
  background-color: #6e83b1 !important;
}
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter