Introducing SchemaMagic: Interactive Entity Framework Schema Visualizer

Magic Suite
1

Introducing SchemaMagic :sparkles:

We’re excited to announce SchemaMagic, a new tool that transforms Entity Framework Core DbContexts into beautiful, interactive HTML schema diagrams with a single command.

:globe_with_meridians: Try It Now

:rocket: Launch SchemaMagic Web App - No installation required!

The web application lets you analyze any GitHub repository (public or private with PAT) and generate interactive schema diagrams directly in your browser.

What is SchemaMagic?

SchemaMagic is an interactive database schema visualizer specifically designed for Entity Framework Core. It analyzes your DbContext files and generates self-contained HTML files with drag-and-drop entity relationship diagrams that help developers understand and explore database schemas.

Interactive Schema Diagram

Key Features

:computer_mouse: Fully Interactive

  • Drag tables to rearrange your schema layout
  • Click tables to select and highlight their relationships
  • Navigate between entities by clicking foreign keys
  • Zoom and pan to explore large schemas
  • Your layout customizations are saved automatically

:link: Smart Relationship Detection

  • Automatically discovers foreign keys from EF migrations
  • Visualizes navigation properties with proper cardinality
  • Shows inheritance hierarchies
  • Professional crow’s foot notation for relationships

:speech_balloon: Documentation Tooltips

  • Hover over properties to see comments from [Comment] attributes
  • XML documentation comments are also displayed
  • Perfect for sharing domain knowledge with your team

:zap: Fast and Easy

  • Parses C# code directly using Roslyn (no compilation needed)
  • Works with Entity Framework Core projects of any size
  • Tested with production schemas containing 100+ entities
  • Generated HTML files are completely self-contained and work offline

Quick Start

Option 1: Web Application (Recommended)

Visit SchemaMagic Web to:

  1. Enter a GitHub repository URL
  2. Select a DbContext file
  3. Generate and download your interactive schema instantly

Option 2: Command-Line Tool

Install as a global .NET tool:

dotnet tool install -g SchemaMagic

Generate an interactive schema:

# Basic usage
schemamagic path/to/MyDbContext.cs

# Custom output location
schemamagic MyDbContext.cs --output MySchema.html

# With custom styling
schemamagic MyDbContext.cs --css-file custom-styles.css

Real-World Testing

SchemaMagic has been successfully tested with production database schemas:

  • :white_check_mark: Small schemas (4-10 entities): Perfect for microservices
  • :white_check_mark: Medium complexity (27 entities): Multi-tenant applications
  • :white_check_mark: Large-scale schemas (100+ entities): Enterprise applications
  • :white_check_mark: Complex relationships: Many-to-many, inheritance hierarchies
  • :white_check_mark: EF Migration integration: Accurate foreign key detection

Interactive Features

Once you open the generated HTML file:

  • Drag & Drop: Reposition tables to create your ideal layout
  • Click to Select: Click a table to highlight only its relationships
  • Navigate: Click foreign keys or navigation properties to jump to related entities
  • Pan & Zoom: Mouse wheel zoom and background dragging
  • Toggle Options: Show/hide inheritance, navigation properties, and more
  • Persistent State: Your layout changes are saved in browser localStorage
  • Keyboard Shortcuts: Press Escape to deselect

Property Visualization

Properties are clearly marked with icons and colors:

  • :key: PK: Primary Key (yellow)
  • :link: FK: Foreign Key (purple)
  • :compass: N: Navigation Property (green)
  • :bar_chart: INH: Inherited Property (blue)
  • Type-specific colors for strings, numbers, dates, etc.

Use Cases

Documentation

  • Include schemas in project documentation
  • Help new developers understand data models
  • Visualize planned schema changes

Code Reviews

  • Explain database changes visually
  • Review entity relationships
  • Validate schema complexity

Architecture Planning

  • Design new features with schema implications
  • Identify refactoring opportunities
  • Analyze technical debt in data models

GitHub Integration

The web application supports both public and private repositories:

  • Public Repos: Just paste the GitHub URL
  • Private Repos: Use a Personal Access Token with repository read permissions
  • Auto-Discovery: Automatically finds all DbContext files in the repository
  • Real-time Processing: Generate schemas without downloading the entire repository

Open Source

SchemaMagic is open source and available on GitHub:

:link: github.com/panoramicdata/SchemaMagic

We welcome contributions! Whether it’s bug reports, feature requests, or pull requests, we’d love to hear from you.

Get Started Today

Try SchemaMagic now:

Have questions or feedback? Reply to this topic or open an issue on GitHub!

Built with :heart: by Panoramic Data Limited