Member Minder Pro, LLC — Brand and UI Elements
MMP Logo Blue
Logo, primary brand applications, headers
Large background areas, body text
Logo, brand marks, primary headers
Primary brand color representing trust and professionalism
High contrast, suitable for text at appropriate sizes
MMP Red, MMP Gold, Off-White
Base
Hover
Ultra Light
Light
Semi Light
Semi Dark
Dark
Ultra Dark
MMP Logo Red
Logo accent, error states, important callouts
Large backgrounds, body text
Logo accent, alerts, important CTAs
Brand accent color adding energy and importance
Use with caution for text, ensure proper contrast
MMP Blue, Off-White, Gray
Base
Ultra Light
Light
Semi Light
Semi Dark
Dark
Ultra Dark
Hover
MMP UI Blue
Headers, navigation, borders, UI elements
Large blocks of text
Navigation, headers, borders, backgrounds, sidebars
Primary UI color for interface elements, provides visual structure
Meets WCAG guidelines for UI elements
Gold, UI Green, Off-White
Base
Ultra Light
Light
Semi Light
Semi Dark
Dark
Ultra Dark
Hover
MMP UI Gold
Secondary buttons, accents, highlights, hover states
Primary navigation, large backgrounds
Buttons, links, highlights, hover effects, call-to-action elements
Secondary/accent color drawing attention to important interactive elements
Provides good contrast on dark backgrounds
UI Blue, Off-White, Gray
Base
Ultra Light
Light
Semi Light
Semi Dark
Dark
Ultra Dark
Hover
MMP UI Green
Tertiary buttons, contrast to gold, alternative CTAs
Primary navigation, headers
Demo buttons, secondary CTAs, success states
Provides attractive contrast to gold, creates visual variety in button hierarchy
Muted sage tone works well for UI elements
UI Blue, Gold, Off-White
Base
Ultra Light
Light
Semi Light
Semi Dark
Dark
Ultra Dark
Hover
MMP Off-White
Backgrounds, surfaces, cards, content areas
Text, borders (use darker shades)
Page backgrounds, card backgrounds, content blocks
Softer than pure white, reduces eye strain for long reading
Excellent contrast with dark text
All colors, especially UI Blue and Gray
Base
Ultra Light
Light
Semi Light
Semi Dark
Dark
Ultra Dark
Hover
MMP Gray
Text, borders, dividers, disabled states
Primary backgrounds (too dark)
Body text, captions, borders, separators, disabled elements
Neutral gray for text and UI elements, provides hierarchy
Darker shades meet WCAG for text
All colors as a neutral
Base
Ultra Light
Light
Semi Light
Semi Dark
Dark
Ultra Dark
Hover
OSDIA
smeraldo [emerald]
Logo identity only. One of the Italian tricolore colors — restricted to official logo applications per brand guidelines.
General UI elements, backgrounds, body text, decorative purposes, or any non-logo usage.
Official OSDIA logo applications only
Represents the Italian tricolore green — symbolizing the plains and lush hills of Italy.
Very dark green with strong contrast against white. Sufficient contrast for large text on white backgrounds. Avoid pairing with Rubino (red-green color blindness concern).
Bianco, Nero
Per OSDIA brand guide: "The red and green primary colors should be used solely for logo identity purposes."
Base
bianco [white]
Logo identity and general use throughout all marketing materials. Backgrounds, text on dark surfaces, spacing, and layout breathing room.
Text on light backgrounds without sufficient contrast.
Backgrounds, logo applications, text on dark surfaces
Represents the Italian tricolore white — symbolizing the snowy Alps and other mountain regions of Italy.
Maximum lightness value. Requires dark text or overlays for readability. Minimum contrast partner should be at least 4.5:1 ratio for normal text.
Nero, Milano Midnight, Smeraldo, Rubino
Safe for universal application per brand guide.
Base
rubino [ruby]
Logo identity only. One of the Italian tricolore colors — restricted to official logo applications per brand guidelines.
General UI elements, call-to-action buttons, error states, backgrounds, or any non-logo usage.
Official OSDIA logo applications only
Represents the Italian tricolore red — symbolizing blood spilled in the Italian wars of independence.
High-saturation red with good contrast against white. Avoid pairing with Smeraldo for body text (red-green color blindness).
Bianco, Nero
Per OSDIA brand guide: "The red and green primary colors should be used solely for logo identity purposes."
Base
nero [black]
Logo identity and general use throughout all marketing materials. Body text, headings, high-contrast UI elements, borders, and icon color.
Large solid background fills where Milano Midnight might be more brand-appropriate.
Body text, headings, borders, icons, logo applications
Signifies the sophistication, authority, and understated luxury often associated with Italian style and culture.
Near-black with excellent contrast against white (~16.5:1). Warm black (slight red undertone at HSL 345°), not pure #000000. Suitable for all text sizes.
Bianco, Siena Harvest, Torino Twilight, Roman Royalty
Warm black — not pure black — gives a more refined, less harsh appearance.
Base
veneto vino
Section accents, decorative borders, highlight backgrounds, and rich visual emphasis areas.
Body text on light backgrounds without testing. Secondary colors are meant to complement, not dominate.
Section accents, decorative borders, highlight backgrounds
Purple signifies royalty, power, and creativity, reflecting OSDIA's rich history and enduring determination.
Dark color (28% lightness). Contrast against white ~9.5:1. Test carefully for normal-size text; may need white or very light text when used as background.
Bianco, Torino Twilight, Siena Harvest
Wine-purple tone evocative of the Veneto wine region.
Base
bari olive
Nature/heritage-themed sections, subtle backgrounds, and earthy design accents.
Pairing with Smeraldo (too similar in hue). Avoid as primary text color.
Heritage-themed sections, subtle backgrounds, earthy accents
Olive green signifies the timeless beauty and resilience of the Tuscan countryside.
Moderate-dark (33% lightness). Contrast against white ~5.8:1, marginal for normal body text at WCAG AA. Use white text on Bari Olive backgrounds.
Roman Royalty, Siena Harvest
Muted, earthy tone. Avoid placing adjacent to Smeraldo without clear separation.
Base
roman royalty
Rich gold-toned accents, heritage sections, award/recognition contexts, and warm design elements.
Small text on medium backgrounds. Avoid where brighter gold (Siena Harvest) is more appropriate.
Heritage sections, award contexts, warm accents
Rich gold signifies the enduring allure of affluence, prestige of success, and timeless beauty of Roman treasures.
Mid-tone (41% lightness). Contrast against white ~4.2:1 — passes WCAG AA for large text only. Pair with Nero for accessible text.
Nero, Siena Harvest, Torino Twilight
The "dignified" gold — use for understated, authoritative accents.
Base
capri cool
Communication-focused sections, links, interactive elements, and coastal/fresh visual themes.
Pairing with Milano Midnight without sufficient contrast. Do not use for error or warning indicators.
Links, interactive elements, coastal-themed sections
Teal signifies clarity, communication, and tranquility, evoking the dramatic beauty of the Amalfi Coast.
Dark teal (22% lightness, 100% saturation). Contrast against white ~7.1:1, passing WCAG AA and AAA for normal text.
Siena Harvest, Roman Royalty, Bianco
Highest-saturation secondary color. Functions well as a link/action color.
Base
siena harvest
Highlights, calls to attention, warm accent areas, featured content markers, and decorative gold elements.
Body text on white backgrounds. Avoid using for warning/caution indicators.
Highlights, featured content markers, decorative gold elements
Harvest gold symbolizes the groundedness, strength, and richness found in the natural beauty of Italy's countryside.
Medium-tone warm color (42% lightness). Contrast against white ~3.4:1 — FAILS WCAG AA for normal text. Use for large/bold decorative text only, or dark text on Siena Harvest backgrounds.
Nero, Capri Cool, Roman Royalty, Palermo Passion
Brightest of the three gold-family colors. The "attention" gold — use sparingly for maximum impact.
Base
palermo passion
Dramatic emphasis, passion/emotion-themed sections, rich visual accents, and heritage contexts.
Do not use interchangeably with Rubino (logo-only). Avoid for error states or destructive action buttons.
Dramatic emphasis, heritage contexts, rich visual accents
Deep red signifies bold and powerful emotion, evoking the passion, intensity, and dramatic flair of Italian culture.
Dark red (33% lightness). Contrast against white ~8.5:1, passing WCAG AA and AAA. Use white text on Palermo Passion backgrounds.
Siena Harvest, Bianco, Nero
The usable red for general brand materials (Rubino is logo-only). Darker and more muted than Rubino.
Base
torino twilight
Subtle backgrounds, muted accent areas, secondary information, and warm supporting elements.
Primary text on white backgrounds. Avoid where stronger emphasis is needed.
Subtle backgrounds, muted accents, secondary information
Light gold signifies the generosity and compassion of Italian culture, combined with the warmth of its natural resources.
Mid-tone (51% lightness). Contrast against white ~2.9:1 — FAILS WCAG AA for all text sizes. Use as background with dark text (Nero) only. Contrast against Nero ~5.7:1 — passes AA.
Nero, Veneto Vino, Roman Royalty
Lightest of the three gold-family colors. The "soft" gold — best for backgrounds and supporting elements.
Base
milano midnight
Authoritative sections, trust-building contexts, dark mode elements, headers, and strong visual anchors.
Pairing as text on Capri Cool backgrounds without testing. Do not use for link text if Capri Cool is already serving that role.
Headers, authoritative sections, dark mode elements, visual anchors
Deep blue signifies authority, knowledge, reliability, and sophistication associated with Roman history and the Italian seaside.
Very dark blue (29% lightness). Contrast against white ~10.5:1, passing WCAG AAA. Use white text on Milano Midnight backgrounds.
Siena Harvest, Roman Royalty, Bianco
Strongest "authority" color. Functions as dark alternative to Nero while maintaining formality.
Base
Rotary International Authorized Brand Colors
Rotary Royal Blue
Primary Rotary branding, official communications, certification badges
Non-Rotary content, MemberMinder Pro branding
Rotary certification sections, official Rotary content areas, RI badges
Official Rotary International primary brand color, enforced by brand guidelines
Strong contrast, suitable for official brand applications
Rotary Gold, White, neutrals
This is an official Rotary International brand color and must be used according to RI brand guidelines
Base
Rotary Gold
Rotary accents, official branding elements, certification highlights
Non-Rotary content, general UI elements
Rotary wheel, accent elements in RI sections, official badges
Official Rotary International secondary brand color
Vibrant gold, use carefully for text applications
Rotary Royal Blue, White, Black
Official Rotary International brand color per RI brand guidelines
Base
Azure
Rotary supplementary color for accents and variety
Primary branding outside of approved applications
Rotary content accents, supplementary elements
Part of Rotary's expanded color palette
Good contrast for UI elements
Rotary Royal Blue, Sky Blue, White
Base
Sky Blue
Rotary supplementary color for lighter accents
Text on white backgrounds
Rotary content backgrounds, light accent elements
Lighter blue from Rotary's expanded palette
May require darker backgrounds for sufficient contrast
Azure, Rotary Royal Blue, White
Base
Cranberry
Rotary accent color for energy and emphasis
Large areas, primary backgrounds
Callouts, highlights in Rotary content
Energetic accent from Rotary palette
Strong color, use sparingly
Neutrals, Rotary Royal Blue
Base
Cardinal
Rotary supplementary red accent
Error messages (could confuse meaning)
Rotary accent elements, highlights
Bold red from Rotary's accent palette
High visibility, use strategically
Neutrals, White, Rotary Royal Blue
Base
Turquoise
Rotary supplementary accent for freshness
Primary branding elements
Rotary content accents, secondary elements
Fresh, energetic accent from Rotary palette
Good contrast for UI applications
Neutrals, Sky Blue
Base
Orange
Rotary supplementary accent for energy
Warning messages (could confuse meaning)
Rotary highlights, energetic accents
Vibrant accent from Rotary palette
High visibility, ensure proper contrast
Neutrals, Rotary Royal Blue
Base
Violet
Rotary supplementary accent color
Large areas, primary elements
Rotary accent elements, variety
Distinctive accent from Rotary palette
Use with care for text applications
Neutrals, Lavender, White
Base
Grass
Rotary supplementary green accent
Success messages (could confuse meaning)
Rotary environmental themes, accents
Fresh green from Rotary palette
Good contrast for most applications
Neutrals, Moss, White
Base
Powder Blue
Rotary soft backgrounds, tints
Text (insufficient contrast)
Rotary background tints, soft accents
Soft neutral from Rotary palette
Background use only, not for text
Rotary Royal Blue, Azure, Neutrals
Base
Moss
Rotary neutral backgrounds and accents
Primary text
Rotary backgrounds, subtle accents
Earthy neutral from Rotary palette
Neutral tone for backgrounds
Grass, Neutrals, White
Base
Lavender
Rotary soft backgrounds, gentle accents
Text (insufficient contrast)
Rotary background tints, soft accents
Soft neutral from Rotary palette
Background use primarily
Violet, Neutrals, White
Base
Taupe
Rotary warm neutral backgrounds
Primary text
Rotary backgrounds, warm neutrals
Warm neutral from Rotary palette
Background and accent use
Rotary Gold, Neutrals, White
Base
Mist
Rotary cool neutral backgrounds
Primary text (may lack contrast)
Rotary backgrounds, subtle UI elements
Cool neutral from Rotary palette
Background and UI element use
Blues, Slate, White
Base
Slate
Rotary medium neutral, borders, text
Large backgrounds
Rotary borders, medium text, dividers
Medium neutral from Rotary palette
Good for UI elements and secondary text
Blues, Mist, White
Base
Charcoal
Rotary dark neutral, text, headings
Light backgrounds
Rotary headings, body text, dark UI elements
Dark neutral from Rotary palette
Excellent for text on light backgrounds
All Rotary colors, White, light neutrals
Base
Pewter
Rotary mid-tone neutral
Primary text on white
Rotary secondary text, icons, borders
Mid-tone neutral from Rotary palette
Good for secondary UI elements
Charcoal, Silver, White
Base
Smoke
Rotary light neutral, backgrounds
Text (insufficient contrast)
Rotary light backgrounds, dividers
Light neutral from Rotary palette
Background use primarily
Charcoal, Pewter, White
Base
Silver
Rotary very light neutral, tints
Text
Rotary backgrounds, very subtle accents
Very light neutral from Rotary palette
Background use only
All Rotary colors, dark text
Base
White
Rotary backgrounds, text on dark backgrounds
N/A – universal
Rotary backgrounds, contrast element
Pure white from Rotary palette
Maximum contrast with dark colors
All Rotary colors
Base
Black
Rotary text, strong accents, backgrounds
N/A – universal
Rotary text, high contrast elements
Pure black from Rotary palette
Maximum contrast with light colors
All Rotary colors
Base
Storm
Rotary warm dark neutral
Light backgrounds
Rotary text, warm dark accents
Warm dark neutral from Rotary palette
Good for text on light backgrounds
Warm neutrals, Taupe, White
Base
Ash
Rotary warm mid-neutral
Primary text on white
Rotary secondary elements, warm accents
Warm mid-neutral from Rotary palette
Secondary text and UI elements
Storm, Platinum, White
Base
Platinum
Rotary warm light neutral
Text
Rotary backgrounds, warm tints
Warm light neutral from Rotary palette
Background use primarily
Storm, Ash, dark text
Base
Cloud
Rotary very light warm neutral
Text
Rotary soft backgrounds, subtle tints
Very light warm neutral from Rotary palette
Background use only
All Rotary colors, dark text