Color System

A closer description to Namirial’s official color palette.

What is the aim?

Basically we provide our main software solutions white labeled, which means we want to stick to Black/White/Gray and add an accent color which can be exchanged by any company if they want to. Our new accent color is Teal with stands for nature and sustainability, which highlights the mission of Namirial. Making business greener.

For eCommerce, Social Marketing and Employer Branding we use Teal in richer way, which makes us more visible as a company. 

How to use the color palette? (Real life examples)

Brand Colors

  • Used for logo design, typography, icons, graphics and highlighting UI elements
Functional Colors
  • Used for status messages like notifications, errors, warnings and success messages. In general colors should follow basic color conventions, like green for success, blue for info/help, orange for warning, red for errors. 
Additional colors
  • Used to differentiate in terms various context. Namirial invented the additional color shade ‘Sandstone’ for the Vertical Solutions, like Gestionali (HR software). Mainly used to differ in backgrounds and for icons.

Accessibility of Color

Color Contrast Check 
  • Normal text, text in images and important elements without texts (e.g. Icons) requires a contrast ratio of at least 4.5:1 (Level AA). For larger text starting from 18pt or 14pt bold a ratio of 3:0:1 is required. WCAG 2.0 – 1.4.3
  • Graphics and user interface components (such as form input borders) requires a contrast ratio of at least 3:0:1. WCAG 2.1 – 1.4.11
  • Excluded from color contrast requirements are mouse-over and interactive elements, which are not restricted to understand the UI or disabled. 

Tools for checking contrast color:

    Color Blindness