Visual design reference for the Ultrasound Physics Interactive Flash Cards series.
Color Palette
#FFFFFF
Page Background
#FFFFFF
Card Background
#3e4761
Primary Text
#5a6178
Secondary Text
#61BDB7
Accent Primary
#FDBD32
Accent Secondary (Discovery)
#4EADA7
Interactive Controls
#61BDB7
Success / Accent
#E2E8F0
Border Light
Typography
Headings: Poppins 400-500
Acoustic Parameters
Section Heading
Label Text
Body: Poppins 400
Sound waves in tissue have measurable properties: frequency, wavelength, period, and amplitude. In diagnostic ultrasound, the transducer sets the frequency; everything else follows.
Numerical Values: JetBrains Mono 400-500
0.31 mm
1540 m/s / 5.0 MHz
cos(45°) = 0.71
Card Anatomy
Header Bar
Card title (left) + Domain badge (right)
Description
1 to 2 sentences explaining the concept and what the student should do.
Sliders, pill buttons, toggles. All controls have minimum 44px tap targets.
Equation Bar
Formula with live-substituted values. Key result in accent-primary, large JetBrains Mono.
Discovery Callout
Appears conditionally when specific parameter combinations are reached. Italic, amber-toned.
Interactive Elements
Pill Buttons
Range Slider
Discovery Callout
Sound travels ~4.7x slower in air than soft tissue. This is why air is ultrasound's enemy.
Domain Badge
SPI Domain 1 | Physical Principles
Value Display
2,755 Hz
Print Version Differences
Print versions use the same palette and typography but replace interactive elements with labeled static SVG diagrams and "Key Concept" summary boxes. The key concept box uses a teal-tinted background with a left accent border, providing the essential takeaway for each card.