Interactive Human Body Muscle Diagram - Male and Female diagrams

Description

The Interactive Human Body Muscle Diagram is a collection of FOUR Scalable Vector Graphics (SVG) templates, each with individual selection for 20 major human body muscle groups. The templates are clickable and responsive, with muscle areas highlighted and labelled on hover. Each muscle can be independently customized with colors, hover information, and hyperlinks. The diagrams cover both front and back views for male and female body types, providing comprehensive anatomical coverage.

NEW in v2.1: Redesigned dark cyberpunk UI with CSS theming support! Style muscles using external CSS with semantic IDs like #pectoralis_major, #biceps, #quadriceps. Includes 6 pre-built color themes (Anatomy, Neon Glow, Ocean, Sunset, Monochrome, Forest) and HTML-based tooltips that display muscle names and groups on hover.

Features

• SVG Graphics — Resolution independent: responsive and fully resizable
• Fully Customisable — Desktop and Mobile ready
• Each muscle can be customized independently (colours, hover information, hyperlink, etc)
• Four different SVGs: Man and Woman, front and back poses
• 20 distinct muscle groups with anatomically accurate positioning
• NEW: Dark cyberpunk UI with gradient accents and glow effects
• NEW: CSS Theming — Style muscles with external CSS using semantic IDs
• NEW: 6 Pre-built color themes (Anatomy, Neon, Ocean, Sunset, Mono, Forest)
• NEW: HTML/JavaScript tooltips showing muscle name and muscle group
• NEW: Bilateral highlighting — hover one side, both left/right muscles highlight
• Interactive flip animation when rotating between front/back views
• The source consists of HTML, CSS and JS files
• Clean, semantic muscle IDs for easy CSS targeting
• Two SVG variants: with tooltips/colors OR clean (no tooltips) for custom styling

Complete List of Clickable Muscles

Front View (16 muscles):

• Pectoralis Major (Chest)
• Deltoid (Shoulders)
• Trapezius (Upper Back/Neck)
• Sternocleidomastoid (Neck)
• Biceps (Upper Arm)
• Triceps (Upper Arm)
• Brachioradialis (Forearm)
• Finger Flexors (Forearm)
• Abdominals (Core)
• External Oblique (Core)
• Quadriceps (Thigh)
• Sartorius & Abductors (Thigh)
• Tensor Fasciae Latae (Hip/Thigh)
• Tibialis Anterior (Shin)
• Gastrocnemius (Calf)
• Peroneus Longus (Lower Leg)

Back View (16 muscles):

• Deltoid (Shoulders)
• Trapezius (Upper Back)
• Infraspinatus & Teres Major (Shoulder/Back)
• Latissimus Dorsi (Mid/Lower Back)
• Triceps (Upper Arm)
• Brachioradialis (Forearm)
• Finger Flexors (Forearm)
• Finger Extensors (Forearm)
• External Oblique (Core)
• Gluteus Maximus (Buttocks)
• Gluteus Medius (Hip)
• Tensor Fasciae Latae (Hip/Thigh)
• Abductors (Hip/Thigh)
• Hamstrings (Thigh)
• Gastrocnemius (Calf)
• Soleus (Calf)

CSS Theming Example

/* Style muscles with simple CSS selectors */
#pectoralis_major path { fill: #ff006e; }
#biceps path { fill: #3a86ff; }
#quadriceps path { fill: #00bbf9; }