Skip to content

Kitchen sink

A page with a wide variety of different Markdown syntax or components to show how these look together. See the following pages for individual examples.

  • New
  • Deprecated
  • Demo
  • 200
  • Experimental

The content of the quote can use any other Markdown syntax.

Card title

The content of the card that can use any other Markdown syntax.

Card title

The content of the card.

Card title

The content of the card.

The summary of the disclosure

The content of the disclosure that can use any other Markdown syntax.

example.astro
---
// A code block example
---
<p>A paragraph with a variable: {Astro.props.foo}</p>
With highlighted content. Including insertions or deletions.
function test() {
const foo = 'bar'
const foo = 'baz'
}
example.astro
---
import { Icon } from '@astrojs/starlight/components'
---
<Icon name="seti:lock" />
<button type="button">Login</button>
<a href="/login/">Login</a>
Build something…
pnpm run build
  • astro.config.mjs an important file
  • package.json
  • README.md
  • Directorysrc
    • Directorycomponents
      • Header.astro
  • Directorypages/

Primary

Secondary

Minimal

  1. The first step of the guide that can use any other Markdown syntax.

    const foo = 'bar'
  2. A second and final step.

Terminal window
npm install starlight-theme-rapide
Column 1Column 2Column 3Column 4
Cell 1-1Cell 1-2Cell 1-3Cell 1-4
Cell 2-1Cell 2-2Cell 2-3Cell 2-4
Cell 3-1Cell 3-2Cell 3-3Cell 3-4
Cell 4-1Cell 4-2Cell 4-3Cell 4-4
Cell 5-1Cell 5-2Cell 5-3Cell 5-4
Cell 6-1Cell 6-2Cell 6-3Cell 6-4