Kitchen Sink
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
Markdown Image

3D printing experiments

Paragraph after a markdown image. The image above uses standard ![alt](src) syntax and is rendered through the optimized Image component.

Image Component
3D printing experiments
Full width, original aspect ratio — the most common usage
Cropped landscape
Cropped to 16:9 with fit="cover"
Styled image
Styled with rounded corners and shadow
Low quality
Low quality JPEG — format="jpeg" quality={10}
Square
Square crop
Portrait
Portrait crop
SVG Component

Inline without a figure — fixed size via className, flows with text.

w-full — stretches to container width
Fixed sizes — h-8, h-16, h-24
Color override — text-primary, text-secondary, text-accent
Typography

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

This is a regular paragraph. Lorem ipsum dolor sit amet, bold text, italic text, and inline code. Here’s a link to somewhere.

Blockquote: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt.

  • First unordered item
  • Second unordered item
  • Third unordered item
  1. First ordered item
  2. Second ordered item
  3. Third ordered item
function greet(name: string): string {
  return `Hello, ${name}!`
}
FeatureStatusNotes
TypographyDoneAll headings, paragraphs, lists
TablesDoneDaisyUI styled with hover rows
ImagesDoneOptimized via Image component

Paragraph after horizontal rule.

Columns with Prose

Left Column

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus lacinia odio vitae vestibulum.

Nulla facilisi. Maecenas non diam id ante tincidunt porta. Sed nec risus non velit aliquam tempus.

  • Alpha item
  • Beta item
  • Gamma item

Right Column

Fusce vel elit in sapien fermentum facilisis. Integer malesuada, lacus eu ultrices porttitor.

3D printing experiments

Praesent eget sem vel leo ultrices bibendum. Aenean faucibus morbi dolor nulla.

Box in Column

Box Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Cras vehicula mi eget laoreet venenatis.

Heading After Box

Lorem ipsum dolor sit amet. Sed do eiusmod tempor incididunt ut labore.

Before Box

Paragraph before a box.

Just a paragraph in a box. Testing spacing.

Paragraph after box.

Second Box

Webdesign cover
  • List item in a box
  • Another list item
Non-breakout Columns

Contained Left

These columns stay within the content width. Lorem ipsum dolor sit amet.

Contained Right

No breakout here. Fusce vel elit in sapien fermentum facilisis.

Callout

Heads up: This is a callout component using DaisyUI’s alert style. Use it for important notes, disclaimers, or time-sensitive information that should stand out from the surrounding content.

Standalone Box

Boxed Section

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

  • Feature one explained
  • Feature two explained

Closing paragraph.

Feature Cards

Why Lorem Ipsum

Dolor sit amet consectetur

With Icon

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

🔒

With Emoji

Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Another Emoji

Ut enim ad minim veniam, quis nostrud exercitation ullamco.

CTA Sections

Default CTA

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Primary CTA

This is the primary variant with a different background.

Deep Nesting

Mixed Content

Paragraph with bold and italic and code.

Blockquote inside a column.

const x = 42

Box with Everything

Paragraph after heading.

  • List in box
  • More items

Blockquote in a box

Final box paragraph.