📝
Ücretsiz Markdown Editörü
Markdown'ı gerçek zamanlı olarak yazın ve önizleyin. Başlıkları, kalın, italik, kod bloklarını, tabloları ve listeleri destekler.
Yüklendikten sonra çevrimdışı çalışır
90 kelime · 600 kar.
Markdown
Önizleme
<h2 class="text-2xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">Markdown Editörüne Hoş Geldiniz</h2>
<p class="my-3 text-slate-700 dark:text-slate-300 leading-relaxed">Sol tarafta <strong>Markdown</strong> yazın, sağ tarafta canlı önizlemeyi görün.</p>
<h3 class="text-xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">Özellikler</h3>
<ul class="list-disc list-inside my-3 space-y-0.5 text-slate-700 dark:text-slate-300"><li class="my-0.5"><strong>Kalın</strong>, <em>italik</em> ve <del>üstü çizili</del> metin</li><li class="my-0.5"><code class="bg-slate-100 dark:bg-slate-800 text-pink-600 dark:text-pink-400 rounded px-1 py-0.5 text-[0.85em] font-mono">Satır içi kod</code> ve kod blokları</li><li class="my-0.5"><a href="https://libratool.com" target="_blank" rel="noopener noreferrer" class="text-teal-600 dark:text-teal-400 underline underline-offset-2">Bağlantılar</a></li><li class="my-0.5">Listeler, alıntılar, tablolar ve daha fazlası</li></ul>
<h3 class="text-xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">Kod örneği</h3>
<pre class="bg-slate-900 dark:bg-slate-950 text-slate-100 rounded-lg p-4 overflow-x-auto text-sm font-mono my-4"><code class="language-javascript">function greet(name) {
return `Hello, ${name}!`;
}</code></pre>
<blockquote class="border-l-4 border-teal-400 dark:border-teal-600 pl-4 my-3 text-slate-600 dark:text-slate-400 italic">Markdown, 2004 yılında John Gruber tarafından web için yazımı kolaylaştırmak amacıyla oluşturulmuştur.</blockquote>
<table class="my-4 w-full text-sm border-collapse"><thead><tr><th class="border border-slate-300 dark:border-slate-600 bg-slate-100 dark:bg-slate-800 px-3 py-2 text-left font-semibold">Özellik</th><th class="border border-slate-300 dark:border-slate-600 bg-slate-100 dark:bg-slate-800 px-3 py-2 text-left font-semibold">Destekleniyor</th></tr></thead><tbody><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">Başlıklar</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">Listeler</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">Tablolar</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">Kod</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr></tbody></table>
Markdown hızlı başvurusu
# Heading 1H1
**bold**Kalın
*italic*İtalik
`code`Satır içi kod
- itemMadde listesi
1. itemNumaralı liste
> quoteAlıntı
[text](url)Bağlantı
Resim
---Ayırıcı
Yaygın kullanımlar
- Markdown'da API Dokümantasyonu YazınMarkdown'da uç nokta açıklamalarını, istek/yanıt örneklerini ve parametre tablolarını taslağını çıkartın.
- Markdown'da Not AlınNotion, Obsidian, Bear veya herhangi bir Markdown uygulamasına yapıştırılabilen yapılandırılmış notları Markdown'da yazın.
- GitHub README'yi Markdown'da YazGitHub depo README'nizi canlı Markdown işleme ile hazırla ve önizle.
- Teknik Dokumentasyon YazYayımlamadan önce Markdown'da API docsları, wiki'ler ve teknik kılavuzlar yazın ve önizleyin.
- Blog Yazılarını Markdown'da YazGhost, Jekyll, Hugo, Hashnode ve diğer Markdown tabanlı yayın platformları için Markdown'da blog yazıları hazırlayın.
Nasıl çalışır
Önizleme, doğrudan araca yerleşik elle yazılmış bir Markdown ayrıştırıcısı tarafından çizilir — marked yok, remark yok, harici kütüphane yok. Kaynağı tarayıcıda satır satır ayrıştırır ve sözdizimini HTML'ye dönüştürür; bu HTML gösterilmeden önce bir temizleyiciden geçirilir.
- 1Satır satır ayrıştırmaÖzel renderMarkdown işlevi kaynağınızı yeni satırlardan böler ve tek geçişte dolaşarak öncelik sırasına göre çitli kod bloklarını, başlıkları (H1–H6), alıntı bloklarını, sıralı ve sırasız listeleri, GFM tablolarını (sütun hizalamalı), yatay çizgileri ve paragrafları eşleştirir.
- 2Satır içi sözdizimi genişletmeToplanan her satır veya hücre ardından inlineMarkdown tarafından işlenir; bu, kalın (** ve __), italik (* ve _), kalın-italik (***), üstü çizili (~~), satır içi kod (), görüntüler () ve bağlantıları ([text](url)) işleyen bir düzenli ifade değiştirme zinciridir — ! öneki yanlışlıkla tüketilmesin diye görüntüler bağlantılardan önce çözülür.
- 3Temizleme ve uzak kaynak engellemeÇizicinin ürettiği ham HTML, <script>, onerror işleyicileri ve javascript: href'leri gibi güvensiz etiketleri ve öznitelikleri kaldırmak için bir temizleyiciden (sanitize-html) geçirilir. İkinci bir geçiş (neutralizeRemote) varsayılan olarak uzak görüntü src değerlerini yer tutucularla değiştirir; böylece siz izin vermeden önizlemenin sessizce harici sunuculara bağlanması önlenir.
- 4.md veya bağımsız .html olarak dışa aktarınMarkdown'u kopyalamak veya indirmek ham kaynak metni yazar. HTML indirmek temizlenmiş çıktıyı kendi satır içi stil sayfasına sahip bağımsız bir belgeye sarar — Tailwind sınıfları yalnızca site içinde çalışır; bu yüzden dışa aktarım bunun yerine düz CSS kuralları paketler ve dosya her yerde okunabilir olur.
İlgili araçlar
HTML'den Markdown'a Dönüştürücü
HTML'yi temiz Markdown'a dönüştürün. Başlıkları, listeleri, bağlantıları, görüntüleri, kod bloklarını, tabloları ve blok alıntıları işler. İçeriği CMS'lerden taşımak için mükemmel.
Deneyin
Markdown'dan HTML'ye Dönüştürücü
Markdown'ı canlı önizlemeyle temiz HTML'ye dönüştürün. Bloglar, CMS'ler veya e-posta şablonları için yapıştırmaya hazır HTML kopyalamak üzere kaynak görünümünü kullanın.
Deneyin
Mermaid Diyagram Editörü
Canlı önizlemeyle Mermaid sözdiziminde akış şemaları, dizi diyagramları, Gantt grafikleri ve daha fazlasını yazın. SVG veya PNG olarak dışa aktarın. Tamamen tarayıcınızda çalışır.
Deneyin