דלג לתוכן הראשי

עורך Markdown בחינם

כתוב וצפה מקדים Markdown בזמן אמת. תומך בכותרות, מודגש, נטוי, בלוקי קוד, טבלאות ורשימות.

פועל לא-מקוון לאחר טעינה
84 מילים · 486 תווים
Markdown
תצוגה מקדימה
<h2 class="text-2xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">ברוכים הבאים לעורך Markdown</h2> <p class="my-3 text-slate-700 dark:text-slate-300 leading-relaxed">כתוב <strong>Markdown</strong> משמאל, ראה את התצוגה החיה מימין.</p> <h3 class="text-xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">תכונות</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>מודגש</strong>, <em>נטוי</em>, ו<del>קו-חוצה</del></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">קוד מובנה</code> וגושי קוד מוגדרים</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">קישורים</a></li><li class="my-0.5">רשימות, ציטוטי בלוק, טבלאות ועוד</li></ul> <h3 class="text-xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">דוגמת קוד</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 נוצר על ידי John Gruber ב-2004 כדי להקל על הכתיבה לרשת.</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">תכונה</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">נתמך</th></tr></thead><tbody><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">כותרות</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">רשימות</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">טבלאות</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">קוד</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr></tbody></table>
מדריך מהיר ל-Markdown
# Heading 1H1
**bold**מודגש
*italic*נטוי
`code`קוד מוטבע
- itemרשימת נקודות
1. itemרשימה ממוספרת
> quoteציטוט
[text](url)קישור
![alt](url)תמונה
---מפריד

שימושים נפוצים

  • כתוב תיעוד API ב-Markdownטיוטת תיאורי נקודת קצה, דוגמאות בקשה/תשובה וטבלאות פרמטר ב-Markdown.
  • קח הערות Markdownכתוב הערות מובנות ב-Markdown שניתן להדביק ל-Notion, Obsidian, Bear או כל אפליקציית Markdown.
  • כתוב GitHub README ב-Markdownשרטט ותצפה ב-README של מאגר GitHub שלך עם עיבוד Markdown חי.
  • כתוב תיעוד טכניכתוב ותצפה בתיעוד API, wikis והנחיות טכניות ב-Markdown לפני פרסום.
  • כתוב פוסטים בבלוג ב-Markdownשרטט פוסטים בבלוג ב-Markdown עבור Ghost, Jekyll, Hugo, Hashnode ופלטפורמות פרסום מבוססות Markdown אחרות.

כיצד זה עובד

התצוגה המקדימה מוצגת על ידי מפענח Markdown כתוב-יד שבנוי ישירות בכלי — ללא marked, ללא remark, ללא ספרייה חיצונית. הוא מפרק את המקור שורה-אחר-שורה בדפדפן, ממיר תחביר ל-HTML שאז עובר דרך מטהר לפני ההצגה.

  1. 1
    פירוק לאסימונים שורה-אחר-שורה
    פונקציית renderMarkdown המותאמת אישית מפצלת את המקור שלך בשורות חדשות ועוברת דרכן במעבר בודד, מתאימה בלוקי קוד גדורים, כותרות (H1–H6), ציטוטי בלוק, רשימות מסודרות ולא-מסודרות, טבלאות GFM (עם יישור-עמודה), קווים אופקיים, ופסקאות בסדר עדיפות.
  2. 2
    הרחבת תחביר inline
    כל שורה או תא שנאספו אז מעובדים על ידי inlineMarkdown, שרשרת החלפות ביטוי רגולרי שמטפלת במודגש (** ו-__), נטוי (* ו-_), מודגש-נטוי (***), קו-חוצה (~~), קוד inline, תמונות (![alt](url)), וקישורים ([text](url)) — תמונות נפתרות לפני קישורים כך שהקידומת ! לא נצרכת לא נכון.
  3. 3
    טיהור וחסימת משאב-מרוחק
    ה-HTML הגולמי שהוצג על ידי המציג עובר דרך מטהר (sanitize-html) כדי להסיר תגיות ומאפיינים לא בטוחים כמו <script>, מטפלי onerror, וקישורי javascript:. מעבר שני (neutralizeRemote) מחליף ערכי src של תמונות מרוחקות בשומרי-מקום כברירת מחדל, מונע מהתצוגה המקדימה 'להתקשר הביתה' בשקט לשרתים חיצוניים לפני שתסכים.
  4. 4
    ייצוא כ-.md או .html עצמאי
    העתקה או הורדה של Markdown כותבת את טקסט המקור הגולמי. הורדת HTML עוטפת את הפלט המטוהר במסמך עצמאי עם גיליון סגנון inline משלו — מחלקות Tailwind פועלות רק בתוך האתר, כך שהייצוא ארוז עם כללי CSS פשוטים במקום, הופך את הקובץ לקריא בכל מקום.

כלים קשורים

שאלות נפוצות