Brand colors, typography, component patterns, voice, and photography guidelines extracted from innovativepetholdings.com. The brand runs two overlapping palettes: Elementary red for all product-facing hero sections, CTAs, and packaging; IPH corporate gold/cream as the site's base theme layer.
Extracted October 20262 typefaces confirmedDual-palette brandBold red dominant
01 - Core brand colors
Dual-palette brand: bold red leads, warm earthy base follows. The Elementary Pet Foods product identity is led by a deep crimson red (#CE102C) across hero sections, CTAs, packaging, and the top announcement banner. This is the color visitors remember. Under it sits the IPH corporate base palette - gold (#dcb676), amber, and warm brown configured in the Astra theme. Red is the challenger energy; gold/cream is the natural/wholesome undertone. Both are in use on the live site.
Elementary product brand (Elementor sections)
Brand Red
#CE102C
RGB 206, 16, 44
Primary CTA color. Hero backgrounds, announcement banner, product packaging, all button fills, key accent moments throughout Elementor sections.
Dark Red
#9B0E25
RGB 155, 14, 37
Red hover state, deep hero gradient anchor, dark red headings on light backgrounds. Used where red needs more weight.
Near Black
#231F20
RGB 35, 31, 32
Primary headline text on white/cream surfaces. Logo wordmark. Used instead of pure black for a warmer, print-quality feel.
Charcoal
#3D3D3D
RGB 61, 61, 61
Secondary body text in Elementor sections. Card descriptions, metadata, supporting copy.
Mid Gray
#58595B
RGB 88, 89, 91
Tertiary text, captions, monospace nutrition facts. Light enough to read on white.
White
#FFFFFF
RGB 255, 255, 255
Primary page background in most Elementor sections. Text on red backgrounds. Clean card surfaces.
IPH corporate base (Astra theme globals)
IPH Gold
#dcb676
RGB 220, 182, 118
Astra theme primary global color. Appears in WordPress-native elements: form accents, tag backgrounds, link hovers at theme level.
IPH Amber
#c1955d
RGB 193, 149, 93
Astra theme secondary global color. Script accent text, hover states on theme-native components.
Dark Brown
#4c423a
RGB 76, 66, 58
Astra theme structural color. Appears in some nav layers, sidebars, and theme-controlled backgrounds.
Warm Cream
#f9f3ed
RGB 249, 243, 237
Astra alternate background color. Some section interstitials and sidebar backgrounds.
02 - Functional & UI colors
Semantic color tokens for rebuilding the Elementary brand in a new site. Red leads all action and CTA moments; near-black grounds the text system; cream provides warmth between sections.
CTA / Accent
#CE102C
RGB 206, 16, 44
All primary CTA buttons, active states, link hovers, progress bars, focus rings.
Text Primary
#231F20
RGB 35, 31, 32
All headlines, card titles, nav wordmark, primary body copy on white.
Text Secondary
#3D3D3D
RGB 61, 61, 61
Body descriptions, card copy. Slightly lighter than primary for typographic hierarchy.
Red Tint
rgba(206,16,44,0.10)
Red at 10% opacity
Subtle background tints for callout sections, badge backgrounds, hover states.
Border Warm
#E2D8CE
RGB 226, 216, 206
Card outlines and dividers. Warm-toned so it does not feel clinical against cream backgrounds.
03 - Tint ramps
Consistent opacity steps for backgrounds, hover states, and overlays.
Brand Red (#CE102C)
6%
12%
25%
50%
75%
100%
IPH Gold (#dcb676)
6%
12%
25%
50%
75%
100%
White on Red (overlays)
5%
10%
25%
50%
75%
100%
04 - Color ratio
White dominates page surfaces; red owns all CTA and hero moments; near-black grounds the text system. The warm earthy tones (cream, gold) surface as section breaks and theme-level details.
38% White
22% Red
18% Dark
12% Cream
6% Gold
4%
White - primary page surfaceBrand Red - CTAs and hero sectionsNear Black - all textCream - warm section interstitialsGold - Astra theme accentsBrown - Astra structural
05 - Contrast & accessibility
WCAG 2.1 compliance targets. All primary text and CTA combinations must pass AA (4.5:1 for normal text, 3:1 for large text). White on Brand Red is the most important pair - it anchors every CTA button and hero section.
Combination
Sample
Ratio
Level
White on Brand Red
Shop Now!
5.9:1
AA
White on Dark Red
Learn More
9.4:1
AAA
Near Black on White
Heading text
17.5:1
AAA
Near Black on Cream
Body text
15.8:1
AAA
Charcoal on White
Description
10.7:1
AAA
Brand Red on White
Link text
5.9:1
AA
Dark Brown on Gold
Astra button
4.9:1
AA
White on Dark Brown
Nav layer
11.1:1
AAA
06 - Typography
Two Google Fonts confirmed from the live site. Rubik (bold, uppercase) powers all H1-H4 headings - big, modern, commanding. Karla handles all body copy and UI text with clean readability. Great Vibes (script) appears as a decorative accent for emotional brand phrases, paired with the Rubik uppercase to create a signature warm-authority contrast. Fonts verified via the site's Astra theme CSS and Elementor page stylesheets.
H1 Display: Rubik 400, Uppercase
Elementary
font-family: 'Rubik', sans-serif • font-weight: 400 • 5.88rem on site (desktop) • text-transform: uppercase • line-height: 1em • Hero display headlines and major section banners
H2 Section: Rubik 400, Uppercase
Why Cold-Pressed?
font-family: 'Rubik', sans-serif • font-weight: 400 • 3.82rem on site • text-transform: uppercase • line-height: 1em • Major section headings throughout the site
H3 Script Accent: Great Vibes 400
Simple, Authentic, Nutrition
font-family: 'Great Vibes', cursive • font-weight: 400 • 2rem • line-height: 1em • Script accent paired with Rubik uppercase - reserved for emotional brand phrases and section taglines, never for navigation or informational text
Cold-pressed at ambient temperature - never high heat - so the heat-sensitive nutrients, natural enzymes, and delicate vitamins your dog needs stay intact from ingredients to bowl. No corn, soy, wheat, seed oils, or artificial additives. Just real food, done right.
font-family: 'Karla', sans-serif • font-weight: 400 • 1rem / 17px • line-height: 1.7 • All body copy, descriptions, paragraph text
Elementary Pet Foods speaks with the passionate conviction of founders who believe they have genuinely solved something the industry got wrong. Direct, science-backed, and confident - but warm and accessible. They lead with the benefit and back it with the data.
Core taglines (trademark)
"There's Nothing Like It!™"
"The Innovation Factory for Pet Foods™"
"Benefits Beyond Food™"
"Feed Less / Waste Less™"
"Simple, Authentic, Nutrition"
"Extend the Love"
"Proof Pawsitive"
"Truly Cold Pressed"
CTA language
Short, direct, action-oriented:
Shop Now! Learn More Take the Watson Challenge Click Here More Info Read More
Voice rules
Lead with the science claim, then explain it: Our food is healthier for your dog
→ Feed 30% less for equivalent nutrition. Same dog. Less food. Less waste.
Use specific numbers and data: Cold pressing uses less energy
→ ~900 metric tons CO2 avoided annually at 10,000 tons production vs. extrusion.
Never say "fluff." Avoids confusion and industry jargon.
Proof language patterns
The brand builds trust through specifics:
AAFCO Method 1 digestibility trials completed - not just "AAFCO approved"
Published white papers + industry studies referenced on Proof Pawsitive page
30% fewer trucks, ~$67,500 freight savings per 100 loads vs. extruded
Watson Challenge - free sample, side-by-side bowl test - palatability proof built into the customer journey
08 - Core components
Navigation bar (white background with red top banner)
There's Nothing Like It! Shop Elementary Cold Pressed Pet Food Today!
Elementary Pet Foods • The Innovation Factory for Pet Foods™
There's Nothing Like It!™
Simple, Authentic, Nutrition
Product cards
Chicken & Superfoods photo
Chicken &
Superfoods Recipe
Crude Protein min: 28% Crude Fat min: 14% Caloric Content: 3660 kcal/kg As Fed: 609 kcal/cup AAFCO: All Life Stages
Shop Now
Salmon & Superfoods photo
Salmon &
Superfoods Recipe
Crude Protein min: 30% Crude Fat min: 10% Caloric Content: 3490 kcal/kg As Fed: 580 kcal/cup AAFCO: All Life Stages
Shop Now
Benefit icon grid (homepage feature row)
Ingredient Integrity
Feed Less / Waste Less™
Made in USA
Science-Backed
Sustainability
Extend the Love
Cold Pressed
AAFCO Verified
Button styles
Primary (Red CTA)
Secondary (Red Outline)
Ghost
Text Link
09 - Photography & imagery
Innovative Pet Holdings uses bold lifestyle photography centered on happy dogs, real ingredients, and science proof moments. The visual system pairs warm photography with high-contrast red sections - natural warmth + confident data-driven energy.
Happy dogs lifestyle
Use
Dogs interacting with the product naturally - eating from bowls, running, playing. Watson (the brand dog), Bernese mountain dogs, labs. Authentic, joyful, real-life moments.
Ingredients / food prep
Use
Close-up shots of whole ingredients - real chicken, salmon fillets, superfoods. Food photography on dark or warm surface materials. Reinforces ingredient integrity messaging.
Product packaging (red)
Use
Product bag photography on the red packaging. 100% recyclable bags are a brand differentiator. Dog breed imagery on packaging. Red background sections are the primary packaging showcase environment.
Generic stock imagery
Avoid
Generic stock photos of dogs or people with no brand connection. Studio-white clean product shots that feel clinical. Over-produced imagery that contradicts the authentic, founder-built brand story.
10 - Decorative elements
The brand uses a small set of decorative elements that reinforce both the challenger energy (red) and the natural/warmth positioning (earthy tones). Hand-drawn and chalk-style elements appear throughout Elementor sections.
Houndstooth divider pattern (red / cream variant)
A houndstooth micro-pattern appears as a horizontal divider between page sections. On the rebuilt site, use Red / Cream rather than Brown / Cream to match the visual brand. Use at low opacity (40-60%) to avoid visual noise.
Great Vibes script accent usage
Simple, Authentic, Nutrition
Extend the Love
The Great Vibes script is reserved for emotional, brand-defining phrases - never for navigation, buttons, or informational text. It pairs with Rubik uppercase headings to create a signature contrast. Use sparingly: one per major section maximum. On red backgrounds, use white or cream for the script text.
Chalk / hand-drawn aesthetic
The Elementor sections use hand-drawn arrows, chalk-board illustrations, frisbee diagrams, and sketch-style callouts. These appear in the "Why Cold-Pressed?" and "Products" sections. They reinforce the founder/artisan story and contrast intentionally with the clinical precision of the nutrition data panels. Do not use stock illustration libraries for this - the hand-drawn quality is part of the brand's authenticity signal.
Icon system
The site uses clean outline SVGs at 40x40px with a rounded border for the benefits grid. Icons use Brand Red (#CE102C) on a soft red-tint background (rgba(206,16,44,0.08)). Stroke weight 1.8px, 24x24 viewBox, rounded linecap/linejoin. The same style extends to navigation icons and UI controls. Previously the icons used amber/gold - in the rebuilt site use red to match the primary brand identity.
11 - Spacing scale
--sp-14pxIcon gaps, tight inline spacing
--sp-28pxCard internal padding tight, chip gap
--sp-312pxCard padding, benefit cell padding
--sp-416pxStandard card padding, body gutter
--sp-624pxPage gutter, section spacing
--sp-832pxSection padding, card grid gap
--sp-1248pxHero vertical padding, section margin
--sp-1664pxMajor section breaks, hero to first content