Skip to content
Library

Udemy. Modern classroom whiteboard with violet ink.

  • Brand
  • Light theme
  • 14 colors
  • 1 typeface

Udemy reads as a calm, instructive marketplace: white canvas with soft cool-gray surfaces, a near-black ink scale for type, and two chromatic accents — a signature violet and a warm orange — that always appear as outlined borders or small marks rather than filled panels. Components are flat and lightweight, leaning on 8px radii and hairline borders instead of heavy elevation. A 3D-illustration vocabulary (soft clay-like product objects, isometric shapes, saturated accent pops) carries the personality, while the UI itself stays disciplined and instructional.

Screenshot of Udemy
Captured from udemy.com on October 11, 2026

Udemy design system

Udemy

Brand2

  • Violet accent for outlined action borders, linked labels, and lightweight interactive emphasis. Do not promote it to the primary CTA color

  • Tinted link hover, soft violet highlight wash, light brand surface

Accent1

  • Secondary accent — badge borders, callout borders, warm icon accent

Neutrals11

  • Card backgrounds in dark sections, inverted surfaces, footer panel

  • Primary text, heading strokes, default icon strokes, body copy

  • Body-level dark surfaces, secondary panel fills

  • Card borders and muted dark backgrounds

  • Muted text, heading accents, low-emphasis borders

  • Helper text, hairline borders, disabled strokes

  • Card outlines, subtle dividers on light surfaces

  • Light borders, icon strokes on white, card edges

  • Page background, secondary surface, button ghost fills

  • Off-white panel surface between white and porcelain

  • Card surface, button text on dark, primary surface

Try a pairing

Pick any two colors from the palette to check whether text stays readable on top.

Aa

Canvas on Aubergine

7.28 : 1 contrast

Background
Text
  • Body textPasses AA 4.5
  • Large textPasses AA 3
  • StrictPasses AAA 7

More DESIGN.md files. Same web, different personalities.