Mermaid yapıştırın. Diyagramı görün. Anında.

Mermaid'i yapıştırın, anında önizleyin, SVG/PNG dışa aktarın, dosya yükleyin, kaydırmak için sürükleyin ve URL ile paylaşın.

Hızlı şablonlar
Mermaid dosyası açHerhangi bir yere bırakın — .mmd · .mermaid · .md · .txt · .mmd dosyası nasıl açılır
Mermaid yükleniyor...Sat 1, Süt 1
İpucu: önizlemede tıklayıp sürükleyin (veya dokunup sürükleyin) ile kaydırın. Dosyaları yüklemek için önizlemeye bırakın.

Mermaid nedir?

Mermaid, diyagramları dinamik olarak oluşturmak ve değiştirmek için Markdown esinli metin tanımlarını kullanan JavaScript tabanlı bir diyagram ve grafik aracıdır. Basit metin açıklamalarından diyagramlar üretmenizi sağlayan açık kaynaklı bir projedir.

Karmaşık çizim araçları yerine, diyagramınızı tanımlayan koda benzer bir sözdizimi yazarsınız ve Mermaid bunu görsel bir diyagram olarak render eder. Bu yaklaşım diyagramları sürüm kontrolüne uygun, güncellenmesi kolay ve dokümantasyon için ideal hale getirir.

Mermaid, dokümantasyon platformları, wikiler ve Markdown dosyalarıyla sorunsuz entegre olur ve geliştiriciler ile teknik yazarların favori araçlarından biridir.

Neden Mermaid kullanmalı?

  • Sürüm kontrolü: Diyagramlar metin dosyalarıdır, bu yüzden kodunuzla birlikte Git’te izlenebilir
  • Hızlı güncellemeler: Tüm diyagramları yeniden çizmek yerine birkaç satır metni değiştirin
  • Tutarlılık: Mermaid düzeni ve stili otomatik olarak yönetir, tutarlı diyagramlar sağlar
  • Tasarım araçları gerekmez: Visio, Lucidchart veya diğer pahalı araçlara ihtiyaç yok
  • Kod olarak dokümantasyon: Diyagramları dokümantasyonunuzla aynı depoda tutun
  • Çapraz platform: Tarayıcılarda ve Node.js’te çalışır, birçok platformla entegre olur
  • Ücretsiz ve açık kaynak: Lisans maliyeti yok, aktif topluluk
  • Birden çok diyagram türü: Akış şemaları, sekans diyagramları, sınıf diyagramları ve daha fazlasını destekler

Akış Şeması

Basit metin tabanlı sözdizimi kullanarak profesyonel akış şemaları oluşturun. Anında önizleme, SVG/PNG'ye dışa aktarma ve URL ile paylaşım - hepsi ücretsiz.

Sıra Diyagramı

Sistem bileşenleri arasındaki etkileşimleri görselleştirmek için UML sıra diyagramları tasarlayın. API dokümantasyonu ve sistem tasarımı için mükemmel.

Gantt Şeması

Gantt şemalarıyla proje zaman çizelgelerini planlayın ve görselleştirin. Basit metin sözdizimi kullanarak görevleri, bağımlılıkları ve kilometre taşlarını takip edin.

Sınıf Diyagramı

UML sınıf diyagramlarıyla nesne yönelimli sistemler tasarlayın. Basit metin kullanarak sınıfları, özellikleri, metotları ve ilişkileri tanımlayın.

Durum Diyagramı

Durum diyagramlarıyla durum makinelerini ve sistem davranışını görselleştirin. Basit metin kullanarak durumları, geçişleri ve olayları modelleyin.

ER Diyagramı

Varlık-ilişki diyagramlarıyla veritabanı şemaları tasarlayın. Basit metin sözdizimi kullanarak varlıkları, özellikleri ve ilişkileri tanımlayın.

Reklam

Mermaid Diyagramları için Tam Rehber

Basit metin tabanlı sözdizimiyle profesyonel diyagramlar oluşturmayı öğrenin

Sık Sorulan Sorular

Mermaid Viewer kullanımı ve diyagram oluşturma hakkında sık sorulan sorular

Bu Mermaid editörü gerçekten ücretsiz mi?
Evet, tamamen ücretsiz. Sınırsız diyagram oluşturabilir, SVG/PNG olarak dışa aktarabilir, URL ile paylaşabilir ve tüm özellikleri kayıt veya ödeme olmadan kullanabilirsiniz. Araç, rahatsız etmeyen reklamlarla desteklenir.
Bir şey yüklemem gerekiyor mu?
Hayır, hiçbir şey yüklemeniz gerekmez. Bu araç tamamen tarayıcıda çalışır. Siteyi açın ve masaüstü, tablet veya mobilde hemen diyagram oluşturmaya başlayın.
Diyagramlarımı nasıl kaydederim?
Çalışmanızı birkaç şekilde kaydedebilirsiniz: 1) SVG veya PNG olarak dışa aktarın, 2) URL ile paylaşın (diyagram kodu URL’de kodlanır), 3) Mermaid metin kodunu kendi dosyalarınıza kopyalayın, 4) .mmd veya .mermaid dosyaları yükleyin/indirin.
Diyagramları dokümantasyonda kullanabilir miyim?
Kesinlikle. Diyagramlarınızı SVG (ölçeklenebilir) veya PNG olarak dışa aktarıp dokümantasyon, sunum veya web sitelerinde kullanabilirsiniz. Mermaid kodunu GitHub, GitLab veya Notion gibi platformlara da gömebilirsiniz.
SVG ile PNG arasındaki fark nedir?
SVG vektör tabanlıdır, her boyutta kaliteyi korur ve web/dokümantasyon için idealdir. PNG raster formattır, hızlı paylaşım için uygundur ancak yeniden boyutlandırmada kalite kaybeder.
Diyagramım neden render olmuyor?
Mermaid kodunuzda sözdizimi hatalarını kontrol edin. Sık sorunlar: kapanmamış tırnaklar, eksik iki nokta/ noktalı virgül, yanlış düğüm kimlikleri veya desteklenmeyen sözdizimi. Sorunu bulmak için diyagramı sadeleştirin.
Başkalarıyla birlikte çalışabilir miyim?
Gerçek zamanlı işbirliği yerleşik değildir, ancak URL ile kolayca paylaşabilirsiniz. Diğerleri açıp düzenleyebilir ve kendi sürümünü geri paylaşabilir. Mermaid metin tabanlı olduğu için Git ile de çok iyi çalışır.
Çevrimdışı da çalışır mı?
İlk yükleme internet bağlantısı gerektirir. Yüklendikten sonra temel düzenleme özellikleri çoğunlukla çevrimdışı çalışır. Dışa aktarma gibi bazı özellikler yine de bağlantı isteyebilir.
Mermaid söz dizimini nasıl öğrenebilirim?
Tüm diyagram türlerine örnekler içeren kapsamlı Mermaid kılavuzumuzla başlayın. Hızlı başlangıç için şablonları kullanın ve ardından mermaid.js.org’daki resmi dokümantasyona bakın.
Görünümü özelleştirebilir miyim?
Evet. Diyagramlar site temasını izler: üst çubuktaki Tema düğmesiyle açık ve koyu arasında geçiş yapın, diyagram eşleşen Mermaid temasıyla yeniden çizilir. Gelişmiş özelleştirme için %%{init:...}%% yönergesiyle renk, yazı tipi ve diğer görsel özellikleri tanımlayabilirsiniz.
Hangi diyagram türleri destekleniyor?
Bu editör başlıca Mermaid diyagram türlerini destekler: flowchart, sequence, class, state, ER, Gantt, pie chart, Git graph, user journey ve daha fazlası.
Diyagram verilerim gizli mi?
Diyagram kodunuz sunucularımıza gönderilmez. Tüm oluşturma işlemi tarayıcıda yapılır. URL ile paylaşırken kod URL’nin içinde kodlanır; içeriğinizi saklamaz veya takip etmeyiz.
Neden metin tabanlı diyagram kullanmalıyım?
Metin tabanlı diyagramlar önemli avantajlar sunar: sürüm kontrolü (Git için ideal), hızlı güncelleme, tutarlı stil, aranabilirlik, hafiflik ve programatik üretim. Pull request incelemelerinde de daha kolaydır.
Mermaid’i web siteme gömebilir miyim?
Evet. Web sitenize Mermaid JavaScript kütüphanesini ekleyip Mermaid kod blokları kullanabilirsiniz. GitHub, GitLab, Notion ve Obsidian gibi birçok platform Mermaid’i zaten yerel olarak destekler.
Önerilen maksimum diyagram boyutu nedir?
Kesin bir sınır yoktur; ancak çok büyük diyagramlar (yaklaşık 100+ düğüm) cihaza bağlı olarak yavaş render edebilir. Karmaşık sistemlerde birden fazla küçük ve odaklı diyagram kullanmak daha iyidir.