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
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
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
✏️ 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.
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.
🚀 Getting Started
Want to build your own integration? Here's how to get started:
Clone the examples repository:
bashgit clone https://github.com/FlatIO/embed-examples.git cd embed-examples
Choose an example to explore:
- Each demo includes its own README with setup instructions
- Most examples can run locally with a simple web server
Get your App ID:
- Sign up for a Flat Embed account
- Create an app in your developer settings
- Use your App ID to authenticate the embed
💡 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!
- Submit a PR to our examples repository
- Share your project with us at developers@flat.io
- Join our community and get help with your integration