Design System

Editing
Preset

Brand

7
Primary
--primary
Secondary
--secondary
Primary Darker
--primary-deep
Primary Lighter
--primary-bright
Primary Hover
--primary-hover
Campaign Accent
--campaign-accent
Campaign Strong
--campaign-accent-strong

Surfaces

7
Campaign Page
--campaign-page
Page Background
--bg-base
Card Surface
--bg-surface
Elevated Surface
--bg-surface-elevated
Brand Surface
--bg-brand-strong
Brand Surface Accent
--bg-brand-strong-alt
Navigation Background
--nav-bg

Text on surfaces

4
Campaign Ink
--campaign-ink
Body Text
--text-main
Muted Text
--text-muted
Inverse Text
--text-inverse

Text on brand

7
On Primary
--text-on-primary
On Primary Muted
--text-on-primary-muted
On Primary Subtle
--text-on-primary-subtle
On Brand Surface
--text-on-brand
On Brand Muted
--text-on-brand-muted
On Brand Subtle
--text-on-brand-subtle
On Secondary
--text-on-secondary

System feedback

3
Success
--sys-success
Error
--sys-error
Warning
--sys-warning

Borders

3
Muted Border
--border-muted
Highlight Border
--border-highlight
Default Border
--border-main

Glass

3
Glass Background
--glass-bg
Glass Blur
--glass-blur
px
Glass Strong
--glass-bg-strong

Overlays

3
Overlay 25
--overlay-dark-25
Overlay 40
--overlay-dark-40
Modal Backdrop
--overlay-backdrop

Atmosphere

2
Primary Background Glow
--bg-orb-primary
Secondary Background Glow
--bg-orb-secondary
101 tokens registered.
In contextReal sections from /components/sections
FULL-SERVICE EXPERIENCE

A premium landing page built from reusable pieces

Use real photography, tokenized overlays, and flexible section data to make each project feel specific.

Why teams and professionals choose SDN Academy

The structure, instructors, and delivery model are designed to support practical progress from the first session.

Practical by design

Focus on hands-on labs and real-world scenarios over pure theory.

Built for current challenges

Curriculum updated for modern engineering stacks.

Expert instructors

Taught by active consultants who implement these tools daily.

Modular approach

Build custom learning paths that fit your exact needs.

Trusted by

Teams scaling with our platform

Cembra
Quality1
NAS
Leasforce
Santander
Zurich

Built for real-world learning

The training was incredibly practical. We applied the concepts directly to simulated environments that mirrored our actual production challenges.

David R.

VP of Engineering

FAQs

Quick answers

Common questions, presented cleanly.

Yes. The stacked variant centers or left-aligns the header and places the question list underneath.

TokensEditable surface
Palette
primary
primary-deep
primary-bright
secondary
bg-base
bg-surface
bg-surface-elevated
bg-brand-strong
sys-success
sys-error
sys-warning
Primary / on-primarySurface / mainBrand / on-brand
Buttons
Cards
DefaultStandard surface.
GlossGlass surface.
ElevatedLifted card.
Typography
Display--text-display
Heading 1--h1
Heading 2--h2
Heading 3--h3
Heading 4--h4
Body large--text-body-lg
Body--text-body
Body small--text-body-sm
Eyebrow--text-eyebrow
Spacing
--space-xxs
--space-xs
--space-s
--space-m
--space-l
--space-xl
--space-2xl
--space-3xl
Elevation
xs
sm
md
lg
xl
2xl
Shapes
CardPill
nonesmmainlgfull