CFD trading carries high risk. 76% of retail accounts lose money. · Regulated by ASIC.
! CFD trading is restricted in {country}. This site provides educational content only. See Terms.
«M»«SITEBRAND»
Instruments
Tools
Education
Brokers
News
design-system / 2026.05

«SITEBRAND» × FxPro Network — Design System v1

Pick one combo per geo. 6 palettes × 5 heroes × 4 eyebrows × 3 grids × 3 compliance plates = 1,080 combinations. Master chrome (header/footer/drawer/risk-strip/signals-bar) is frozen across all 21 sites; only palette tokens flip.

01 Color palettes

Six palettes, dark + light

Activation: body[data-palette="{key}"][data-theme="{dark|light}"] · All pass WCAG AA on text + accent over bg + heading over card.

02 Hero patterns

Five hero variants

Each renders full-width below. Class: .hero.hero--{key}.

01 / 05utility-searchStripe-doc utility default · AU pilot live
02 / 05editorial-headlineMagazine-broadsheet · serif H1 + live spread sidebar
03 Strategies

Read the tape, not the noise.

A working library of forex strategies, candle theory, and risk frameworks — built for traders who care about process more than entries.

Browse all strategies →
03 / 05card-stack3 horizontal cards · action-first dashboard hero
tools · calculators · live

Three tools. One screen. No friction.

Pip value calc

Lot size1.00
per pip ≈ $10.00

Top signals live

EUR/USDBUY1.0850
XAU/USDBUY2,381.4
USD/JPYSELL155.42
AUD/USDSELL0.6580
GBP/USDBUY1.2410
04 / 05calc-frontCalc IS the hero · Tools-hub identity
#0a3/ Tools

Pip value calculator

Live calculation. No sign-up, no email. Pick instrument, lot size, account currency — see the value per pip.

1 pip$10.00
10 pips$100.00
50 pips$500.00
units      = 100,000
pip_size   = 0.0001
lot        = 1.00
pip        = 100,000 × 0.0001 × 1 = 10 USD
05 / 05marquee-bannerBloomberg-terminal feel · full-bleed top ticker
EUR/USD1.0850+0.12% GBP/USD1.2410+0.08% USD/JPY155.42−0.21% XAU/USD2,381.4+0.59% AUD/USD0.6580−0.03% NZD/USD0.5980−0.14% USD/CHF0.9050+0.05% USD/CAD1.3640+0.11% BTC/USD64,820+1.24% ASX 2007,820−0.18% EUR/AUD1.6480+0.15% EUR/JPY168.65−0.07% EUR/USD1.0850+0.12% GBP/USD1.2410+0.08% USD/JPY155.42−0.21% XAU/USD2,381.4+0.59% AUD/USD0.6580−0.03% NZD/USD0.5980−0.14% USD/CHF0.9050+0.05% USD/CAD1.3640+0.11% BTC/USD64,820+1.24% ASX 2007,820−0.18% EUR/AUD1.6480+0.15% EUR/JPY168.65−0.07%
#fx/ Live

Markets, all in one tape.

Forex, indices, metals, crypto. One ticker, one terminal-grade view, refreshed every tick.

Open the terminal →
03 Eyebrow patterns

Four distinct eyebrow patterns

All in 12px JetBrains Mono. Class: .eyebrow.eyebrow--{key}. Use above hero H1 and section H2.

Tools 02

Pip value calculator

key: code-comment · AU pilot live default
01 Strategies

Read the tape, not the noise

key: numbered-prefix · accent + muted split
Tools · Calculators · Latest

One screen. No friction.

key: dot-separator · all-muted breadcrumb feel
#0a3/ Tools

Markets, all in one tape

key: hex-tag · designer/dev-tone
04 Feature grids

Three feature-grid layouts

Activation: .feature-grid.feature-grid--{key}. All items use min-width: 0 to prevent overflow.

01 / 03cards-3x2Default · equal-size 3-up
/c

Calculators

Pip, margin, position size, profit/loss — all interactive.

5 tools
/e

Education

Glossary, strategy library, beginner course, risk frameworks.

112 articles
/s

Live signals

Top entries refreshed every minute, with TP and SL.

12 / day
/t

Strategies

Backtested setups for trending, ranging and news markets.

32 strategies
/n

News

Curated market updates and central-bank rate decisions.

daily
/b

Brokers

FxPro deep-dive plus comparison vs IC Markets and Pepperstone.

3 reviews
02 / 03featured-2x3First card 2× wide · hero of the grid
03 / 03split-list-detail1/3 sidebar list · 2/3 expanded panel

Pip

noun · from "percentage in point" · updated 2026-04-12

The smallest standardized price move on a forex pair. For most pairs, one pip equals 0.0001 of the quote currency. For JPY pairs, one pip equals 0.01.

Pips are how traders measure profit, loss, and spread. A 10-pip move on EUR/USD with a 1-lot position is worth 100 USD.

05 Compliance plates

Three jurisdiction variants

Activation: body[data-compliance="{key}"]. These render adjacent to the risk-strip.

single-regulator · use for AU, ZA, single-license geos · copy slot in risk-strip
CFD trading carries high risk. 76% of retail accounts lose money. · Regulated by ASIC.
multi-regulator-strip · default for most geos · 4-regulator rotation in risk-strip
CFD trading carries high risk. 76% of retail accounts lose money. · FxPro is regulated by FCA
CySEC
SCB
FSCA
restricted-jurisdiction-banner · TR / JP / ID Wave-2 · amber banner ABOVE risk-strip
! CFD trading is restricted in Türkiye. This site provides educational content only. See Terms.
CFD trading carries high risk. See the regulator notice above.
06 Page templates

Seven page types — one combo each

Each template is a working full-page demo. Combos are illustrative — any combo can be swapped via Astro props.

07 Tweaks panel

Live preview controls

Floating bottom-right · collapsible · all toggles wire into body[data-*] attributes. Click a palette swatch to flip the entire showcase. Click theme to swap dark↔light.

Scroll up after toggling — every section above re-renders against the new tokens.

08 Chrome contract

Frozen across the network

Header / footer / drawer / risk-strip / signals-bar — byte-stable across all 21 sites. Only palette tokens flip per geo.

/h

64px sticky header

Brand mark + 6-item nav (5 dropdowns + FxPro accent) + lang-pill + theme toggle + CTA + hamburger. Backdrop-blur.

/d

Mobile drawer

Sibling of header. grid-template-rows: auto 1fr auto. Accordion sections, sticky CTA, safe-area padding.

/r

Risk strip

Above header, dismissible to localStorage. Copy slot supports single-regulator and multi-regulator rotation.

/s

Signals bar

Mobile-only sticky bottom. width: max-content + flex: none on items. Mask-image fade edges.

/f

Footer

5 columns desktop, 2-col @900px, 1-col @480px. 4-paragraph disclaimer. Mono bot-line with build hash.

/g

Page guards

Always-visible scrollbar. overflow-x: clip. min-width: 0 baseline. safe-area-inset-* everywhere.

LIVE