Skip to content

Live Demos

Explore our collection of live examples showcasing the power and flexibility of Flat's Embed API. All demos are open-source and available in our FlatIO/embed-examples repository.

🎵 Viewer Demos

These examples demonstrate how to display and interact with sheet music using Flat's embed viewer.

YouTube Synced Player

Synchronize sheet music playback with YouTube videos:

  • Load MusicXML files alongside YouTube videos
  • Sync notation display with video timeline
  • Perfect for music education and analysis

Live DemoSource Code

External Audio Player Integration

Use Flat's beautiful notation rendering with your own audio player:

  • Load local MusicXML files
  • Connect to custom audio playback systems
  • Maintain full control over the audio experience

Live DemoSource Code

Groove Pizza Sheet Music Generator

Transform rhythmic patterns into readable sheet music! This demo integrates with the Groove Pizza app to:

  • Generate MusicXML from circular rhythm patterns
  • Display the notation instantly using Flat's Embed
  • Allow users to print or import the generated music

Live DemoSource Code

✏️ Editor Demos

These examples show how to integrate Flat's music notation editor into your applications.

Embed Editor Basics

Get started with our embeddable editor in just 25 lines of code! This minimal example demonstrates:

  • Basic editor initialization
  • Loading and saving scores
  • Essential API methods

Perfect for developers who want to quickly understand the editor capabilities.

View Documentation & Code

Music Snippet - Google Docs Add-on

Insert beautiful sheet music directly into your documents with Music Snippet:

  • Create music notation within Google Docs
  • Export and insert as high-quality PNG images
  • Works with both Google Docs and Slides

This add-on demonstrates how to integrate Flat's editor into third-party platforms.

Install Add-on

🚀 Getting Started

Want to build your own integration? Here's how to get started:

  1. Clone the examples repository:

    bash
    git clone https://github.com/FlatIO/embed-examples.git
    cd embed-examples
  2. Choose an example to explore:

    • Each demo includes its own README with setup instructions
    • Most examples can run locally with a simple web server
  3. Get your App ID:

💡 Build Your Own

These demos are just the beginning! The Flat Embed API enables countless possibilities:

  • Education: Interactive music theory exercises
  • Publishing: Embedded sheet music in blogs and articles
  • Analysis: Music visualization and annotation tools
  • Games: Musical puzzles and learning games
  • Media: Synchronized playback with video content

Check out our JavaScript/TypeScript SDK documentation to learn about all available features.

📚 Resources

🤝 Contributing

Have you built something cool with Flat's Embed API? We'd love to feature it!

Need Help?

Copyright © Tutteo Limited