تیتر نمایشی H1

متن زیرعنوان میان عنوان و متن بدنه قرار می‌گیرد. این بخش باید روشن خوانده شود، درست بشکند، و در راست‌به‌چپ ریتم آرام خود را نگه دارد.

متن بدنه سبک خواندن عادی را نشان می‌دهد. این پاراگراف شامل تأکید پررنگ، تأکید کج، متن برجسته، متن حذف‌شده، متن افزوده‌شده، کد درون‌خطی، Ctrl + K، H₂O، x²، i18n، و یک پیوند متنی است.

متن کوچک برای زیرنویس، یادداشت و فراداده آرام مناسب است.

تیتر بخش H2#

سطح دوم بخش‌های اصلی را جدا می‌کند. وزن آن باید برای یافتن ساختار کافی باشد، بدون آنکه متن بدنه را دور کند.

تیتر زیربخش H3#

سطح سوم برای مرور سریع کاربرد دارد. این سطح باید از متن پررنگ معمولی جدا دیده شود.

تیتر کوچک H4#

سطح چهارم برای گروه‌های فشرده، روندهای کوتاه یا مثال‌های محدود مناسب است.

برچسب H5

سطح پنجم برای برچسب‌های کوچک بالای متن‌های فشرده کاربرد دارد.

برچسب ریز H6

سطح ششم کوچک‌ترین تیتر است و همچنان باید خوانا بماند.

قالب‌بندی درون‌خطی#

فهرست‌ها و چک‌باکس‌ها#

• یک مورد فهرست نامرتب با جمله کوتاه.
• موردی با متن پررنگ و کد درون‌خطی.
  • مورد تو در تو.
  • موردی با ارجاع متنی ساده.

1. مورد مرتب برای گام نخست.
2. مورد مرتب برای گام دوم.
3. موردی با خط بلندتر برای آزمون شکست متن در صفحه‌های کوچک.

• مورد انتخاب‌شده با ورودی غیرفعال.
• مورد انتخاب‌نشده با ورودی غیرفعال.
• مورد انتخاب‌شده دیگر برای بررسی فاصله‌ها.

بدنه

سبک پیش‌فرض پاراگراف برای خواندن طولانی.

زیرعنوان

یک خط کوتاه پشتیبان در نزدیکی عنوان.

جدول، نقل‌قول و یادداشت#

جدول HTML#

عنصر	کاربرد	بررسی
تیتر	ساختار صفحه	مقیاس روشن
پاراگراف	جریان خواندن	ارتفاع خط مناسب
چک‌باکس	وضعیت فرم	فاصله و تمرکز آشکار

جدول Markdown#

عنصر	کاربرد	بررسی
پیوند	ناوبری	حالت hover و focus روشن
کد	متن فنی	سبک درون‌خطی متمایز
فهرست	محتوای گروه‌بندی‌شده	فاصله خوانا

نقل‌قول#

نقل‌قول به یک بخش لحن متفاوت می‌دهد و پهنای خواندن را ثابت نگه می‌دارد.

یادداشت#

این یادداشت از یک نشانگر کوچک استفاده می‌کند. باید در حالت روشن و تاریک آرام و دسترس‌پذیر بماند.

---

بلوک کد#

const formatTitle = ({ title, lang }: { title: string; lang: string }) => {
  const label = new Intl.DisplayNames([lang], { type: "language" }).of(lang) || lang;
  return `${title} - ${label}`;
};

formatTitle({ title: "نمونه تایپوگرافی", lang: "fa" });

خلاصه بازشونده

محتوای پنهان فاصله، تمرکز و ریتم متن در عنصر بومی details را می‌آزماید.

تصاویر#