buildHtml
baseUrl https://pitch.scroll.pub
metaTags
editButton /edit.html
title Perfect Pitch Trainer
style.css
header
 class hero
 nav
  div Perfect Pitch
   class logo
  div
   class nav-links
   a Train
    href #trainer
   a About
    href #about
   a Stats
    href #stats
   button Start Training
    class cta-button
    onclick startTraining()
main
 section
  id trainer
  class pitch-trainer
  h1 Train Your Perfect Pitch
  div
   class trainer-container
   div
    class piano-container
    div
     class piano-keys
   div
    class training-controls
    button Play Note
     onclick playRandomNote()
    button Check Answer
     onclick checkAnswer()
    div
     class note-buttons
 section
  id about
  class about-section
  h2 What is Perfect Pitch?
  p Perfect pitch, or absolute pitch, is the ability to identify or reproduce any musical note without a reference tone.
  div
   class features-grid
   div
    class feature-card
    h3 Train Daily
    p Regular practice is key to developing perfect pitch
   div
    class feature-card
    h3 Interactive Learning
    p Use our piano interface to test and improve your skills
   div
    class feature-card
    h3 Track Progress
    p Monitor your improvement with detailed statistics
 section
  id stats
  class statistics
  h2 Your Progress
  div
   class stats-container
   canvas
    id statsChart
footer
 div
  class footer-content
  p Built with passion for musicians
  div
   class footer-links
   a Terms
    href /terms
   a Privacy
    href /privacy
   a Contact
    href /contact
script.js