Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
Nagłówki
H3 — Podtytuł sekcji
H4 — Podsekcja
H5 — Szczegółowy podział
Typografia
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pogrubienie (bold) i kursywa (italic) używane są do wyróżnienia ważnych informacji. Tekst może też zawierać kod inline, który wyróżnia fragmenty kodu lub nazwy techniczne.
Link do strony głównej prowadzi do innej podstrony. Linki są podkreślone i zaznaczone akcentowym kolorem.
Cytat blokowy (blockquote) — Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Listy
Lista punktowana
- Lorem ipsum dolor sit amet consectetur
- Adipiscing elit sed do eiusmod tempor
- Zagnieżdżony element listy
- Kolejny zagnieżdżony element
- Incididunt ut labore et dolore magna
- Ut enim ad minim veniam quis nostrud
Lista numerowana
- Lorem ipsum dolor sit amet
- Consectetur adipiscing elit
- Sed do eiusmod tempor incididunt
- Ut labore et dolore magna aliqua
Tabela
| Kolumna A | Kolumna B | Kolumna C |
|---|---|---|
| Lorem | ipsum | 100 |
| Dolor | sit amet | 200 |
| Consectetur | adipiscing | 300 |
| Elit | sed do | 400 |
Blok kodu
// Lorem ipsum — przykład kodu JavaScript
function loremIpsum(words = 5) {
const list = ['lorem', 'ipsum', 'dolor', 'sit', 'amet'];
return list.slice(0, words).join(' ');
}
const result = loremIpsum(3);
console.log(result); // lorem ipsum dolor/* Przykład kodu CSS */
.lorem-ipsum {
display: flex;
gap: 1rem;
padding: 1.5rem;
background: var(--surface);
border: 1px solid var(--border);
border-radius: 10px;
}Komponenty MDX
Badge
przykłady design styleguideButton
Przycisk primary Przycisk secondary Przycisk outline Rozmiar sm Rozmiar lgDisclaimer
Diagram Mermaid
Separator poziomy
Powyżej i poniżej tego akapitu znajdują się separatory poziome (---).
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce posuere, magna sed pulvinar ultricies, purus lectus malesuada libero, sit amet commodo magna eros quis urna.