digtools
📈
text to flowchart,

Teks ke Diagram Alur

Ketik sintaks Mermaid dan buat diagram alur secara instan. Tanpa server — pemrosesan 100% lokal.

🔒
Tanpa pengiriman ke server
Diagram Anda tetap di perangkat setiap saat
Pratinjau real-time
Diagram diperbarui otomatis saat Anda mengetik
💾
Ekspor SVG / PNG
Simpan gambar berkualitas tinggi secara instan
Pemrosesan lokal — diagram Anda tidak pernah meninggalkan browser
about,

Tentang

Teks ke Diagram Alur adalah alat browser gratis yang menghasilkan diagram alur, diagram urutan, dan lainnya secara otomatis dari sintaks Mermaid.

Semua pemrosesan dilakukan secara lokal menggunakan Mermaid.js — tidak ada data yang dikirim ke server eksternal, sehingga aman untuk alur kerja rahasia.

Ekspor sebagai SVG atau PNG secara instan. Tanpa instalasi aplikasi — cukup buka di browser dan mulai membuat diagram.

how to,

Cara Menggunakan

LANGKAH 1

Masukkan kode

Ketik sintaks Mermaid di editor kiri. Contoh diagram sudah tersedia untuk membantu Anda memulai.

LANGKAH 2

Lihat secara real-time

Pratinjau di sebelah kanan diperbarui secara real-time. Jika ada kesalahan sintaks, pesan bantuan akan ditampilkan.

LANGKAH 3

Simpan sebagai SVG atau PNG

Klik "Simpan SVG" atau "Simpan PNG" untuk mengunduh diagram langsung ke perangkat Anda.

glossary,

Glosarium

Mermaid.js
Library JavaScript yang menghasilkan diagram dari sintaks teks. Didukung secara resmi di Markdown GitHub.
Diagram Alur (Flowchart)
Representasi visual dari suatu proses. Dibuat di Mermaid dengan graph TD atau graph LR.
SVG (Scalable Vector Graphics)
Format gambar vektor yang tidak bergantung pada resolusi. Dapat diperbesar tanpa kehilangan kualitas, ideal untuk presentasi dan cetak.
Node
Setiap elemen dalam diagram (persegi, lingkaran, belah ketupat, dll.). Didefinisikan di Mermaid sebagai A[Label].
Edge (Sisi)
Panah atau garis yang menghubungkan node. Dilambangkan dengan --> (panah) atau --- (garis).
Diagram Urutan (Sequence Diagram)
Diagram yang menampilkan interaksi antar aktor dari waktu ke waktu. Dibuat dengan sequenceDiagram.
faq,

Pertanyaan Umum

Q.Bisakah saya menggunakan teks bahasa Indonesia di dalam node?
Ya. Mermaid.js mendukung Unicode sehingga Anda bisa menggunakan bahasa apa saja di dalam node diagram.
Q.Apa yang harus dilakukan jika diagram meluap dari area pratinjau?
Area pratinjau mendukung scroll. Anda juga bisa mengubah arah layout dari "graph TD" (atas-bawah) ke "graph LR" (kiri-kanan).
Q.Apakah diagram saya dikirim ke server?
Tidak. Semua pemrosesan dilakukan secara lokal di browser menggunakan Mermaid.js. Konten diagram tidak pernah dikirim ke server eksternal.
Q.Apa perbedaan SVG dan PNG?
SVG adalah format vektor yang tidak kehilangan kualitas saat diperbesar, ideal untuk presentasi dan cetak. PNG adalah format raster, praktis untuk ditempel langsung di dokumen.
Q.Bisakah saya membuat jenis diagram selain diagram alur?
Ya. Mermaid.js mendukung diagram urutan (sequenceDiagram), diagram kelas (classDiagram), bagan Gantt (gantt), dan lainnya.
Q.Apakah kode tersimpan antar sesi?
Versi saat ini tidak menyimpan kode antar sesi. Untuk mengedit nanti, salin kode Mermaid dari editor dan simpan secara lokal.
use cases,

Kasus Penggunaan

📐

Dokumentasi sistem

Dokumentasikan alur pemanggilan API atau skema database dengan Mermaid dan sematkan dalam dokumentasi teknis.

📋

Notulen rapat dan alur kerja

Visualisasikan alur kerja atau proses persetujuan dari rapat dengan cepat dan bagikan ke tim Anda.

🎤

Slide presentasi

Saat membuat diagram di PowerPoint terlalu lambat, buat di Mermaid, ekspor sebagai PNG, dan tempel di slide.

📚

Materi pendidikan

Visualisasikan langkah-langkah algoritma atau garis waktu sebagai diagram alur untuk materi belajar yang lebih mudah dipahami.

mermaid syntax,

Sintaks Mermaid

Diagram alur dasar (graph)

graph TD
  A[Mulai] --> B{Kondisi}
  B -->|Ya| C[Proses A]
  B -->|Tidak| D[Proses B]
  C --> E[Selesai]
  D --> E

Referensi bentuk node

A[Teks] — Persegi
B(Teks) — Bulat
C{Teks} — Belah ketupat
D((Teks)) — Lingkaran
E>Teks] — Asimetris
F[(DB)] — Basis data

Kirim Umpan Balik

Beri tahu kami pendapat Anda untuk membantu kami menyempurnakan alat ini.

Sanggahan

Semua alat yang disediakan di situs ini sepenuhnya gratis untuk digunakan, namun harap gunakan dengan risiko Anda sendiri. Kami tidak memberikan jaminan apa pun terkait keakuratan, kelengkapan, atau keamanan hasil perhitungan, hasil konversi, atau data yang dihasilkan. Harap diketahui bahwa operator tidak bertanggung jawab atas segala kerusakan atau masalah yang disebabkan oleh penggunaan alat-alat ini. Sebagian besar alat memproses file dan perhitungan secara lokal di browser Anda, artinya data yang Anda masukkan tidak dikirim atau disimpan di server kami.