Brand Identity
VISUAL IDENTITY REFERENCE

The Kagels Trading visual identity

This is the visual language of the new kagels-trading.com. Every color, typeface and component shown here is taken directly from the approved homepage design, so the whole site stays consistent. This page is built in that same identity, it is a live sample of it, not a description of it.

COLOR

A calm blue system, with one loud accent

Blue carries the brand, yellow is saved for the single most important action, and the market colors carry meaning. Each color below has one job.

Brand blue family
The core identity color and its supporting shades, used for links, charts, buttons and the deep gradient backgrounds.
Primary blue
#0052FF
The main brand color. Links, primary chart lines and blue buttons.
Light blue
#4684FF
Decoration only. Gradient tints, hover borders and chart fills. Never used for text.
Deep blue
#0037B3
The middle of the hero gradient, and the darker hover state for blue buttons.
Navy
#021747
The deepest point of the blue gradient, where the hero and newsletter bands land, and where the footer begins before it deepens to near-black.
Call to action
One color, one purpose. Yellow only ever marks the single most important action on a screen.
CTA yellow
#FFD814
Reserved for the one primary action. Always paired with dark text, never white.
CTA yellow, hover
#D7B50C
The hover state. The yellow only darkens, it never turns blue.
Market colors
These colors mean something, so they are used sparingly. The two greens split the work on purpose: the darker green carries any green text so it stays easy to read, and the brighter green is kept for dots, icons and drawn graphics.
Bullish green
#009500
Up moves and the live status. Reserved for dots, icons and drawn graphics like sparklines and candles, never for text.
Bearish red
#C40D0D
Down moves and the support level on a chart.
Target green
#007A00
The darker green that carries all green text, like live labels and positive change figures, so it stays readable. Also marks the target level on a chart.
Text and backgrounds
The quiet neutrals that hold everything together, from headings down to hairline borders.
Heading ink
#050F19
Headlines and the strongest dark text.
Body text
#3D3D3D
The default color for reading text.
Muted text
#5B616E
Captions, timestamps and secondary labels.
Hairline
#EEF0F3
Thin borders and dividers between cards.
Section tint
#F5F8FF
A faint blue-white for alternating section backgrounds and card panels.
White
#FFFFFF
The page background and the surface of every card.
Footer black
#0A0B0D
The near-black the footer settles into at its base. The footer starts from navy and deepens into this.
Text pairings
These are the combinations that stay easy to read. Each passes accessibility contrast checks, with one clearly marked exception we never use.
Dark text on white
Readable. Passes accessibility checks. The everyday reading combination.
White on navy
Readable. Passes accessibility checks. Used on the dark gradient bands.
Dark navy on yellow
Readable. Passes accessibility checks. This is why the yellow button uses dark text.
Blue link on white
Readable. Passes accessibility checks. Links and small blue labels.
White on brand blue
Readable. Passes accessibility checks. Blue buttons and filled panels.
Never usedwhite on yellow
Not used. White on yellow is unreadable, so yellow always carries dark text instead.
TYPOGRAPHY

Two typefaces, clearly divided

A distinctive typeface carries the headlines, prices and buttons. A fast, familiar system font carries the reading text. Numbers always line up in neat columns.

DISPLAY VOICE
Schibsted Grotesk
Headlines, prices and buttons. The recognisable brand voice.
Gold forecast 2026500 Gold forecast 2026600 Gold forecast 2026700 Gold forecast 2026800
READING VOICE
System body font
Fast, familiar and comfortable for longer text. Used for all reading copy.

Karsten Kagels has traded gold, indices, forex and commodities since 1986. His forecasts, trusted by German traders for a decade, are now published in English.

Every forecast shows its working, so you can follow the reasoning, not just the arrow. Support, resistance and price targets are marked directly on the chart.

H136 to 54px · 800
Forecasts from 40 years at the charts
H230 to 44px · 700
Live reads morning, midday and after the close
H322px · 700
Gold holds the 3,330 pivot
Lead20px · 400
A slightly larger intro line that opens a section without shouting.
Body18px · 400
The standard reading size. Comfortable for paragraphs of explanation and analysis across the whole site.
Eyebrow14px · 700 · spaced
TODAY'S FORECASTS
The small label above a heading. It deliberately uses the reading font, not the display font.
Fine print13px · 400
Timestamps, disclaimers and the smallest supporting notes.
PRICE DISPLAY
3,352.10 +0.6%

Prices are set large in the display font at 36px and weight 800, so a headline number reads instantly.

DIGITS ALIGN
  • 3,352.10Gold
  • 6,281.50S&P 500
  • 44,470.00Dow Jones
  • 98.32Dollar Index

All prices and stats use tabular figures, so digits line up in columns and are easy to compare.

COMPONENTS

The building blocks, live

These are the real pieces the site is made from, shown exactly as they behave. Hover any of them to see how they respond.

TEXTURE AND MOTION

Depth without noise

The blue backgrounds carry subtle textures that add depth up close. Movement is quiet and purposeful, and switches off entirely for anyone who prefers less motion.

Hero gradientA diagonal blue-to-navy sweep with a soft light glow in the upper left.
Dot textureA fine dotted grid over the gradient, for a printed, tactile feel.
Grid whisperA faint graph-paper grid, a quiet nod to charts and price grids.
Rising price linesThree price lines drifting upward through the hero, shown stronger here; on the site they are barely visible.
Film grainA barely-there noise layer that softens flat color and adds warmth.

How things move

  • Hovers are quick, around a fifth of a second, so the page always feels responsive.
  • Sections fade up gently as you scroll into them, one soft step, never a bounce.
  • Nothing flashes or loops, except the small live dot, which pulses slowly to show a market is active.
  • All movement switches off automatically for visitors whose device is set to reduce motion.
VOICE

How we sound

The writing matches the design: calm, specific and factual. The tone earns trust by showing its reasoning, not by turning up the volume.

  • No hype, no signals-for-sale theatre. The work speaks for itself.
  • Plain English, reasoning always shown. Every call explains the why behind it.
  • Numbers only when verified. Prices and stats are real and checked, never invented.
  • Calm, specific, factual. Concrete levels and clear verdicts, no filler.
Good

Gold holds above 3,300. Target 3,420, support 3,285.

Avoid

Unlock massive profits now!