Skip to main content

Overview

This page documents the nested types that control layout, spacing, and visual styling for specific markdown elements including tables and images.

Spacings

Controls spacing and padding throughout the markdown view.

Declaration

public struct Spacings: Equatable

Properties

final
CGFloat
default:"16"
The final spacing applied after the last element in the markdown content.
general
CGFloat
default:"8"
General spacing between markdown elements (paragraphs, headings, etc.).
list
CGFloat
default:"8"
Spacing between list items.
cell
CGFloat
default:"32"
Spacing for table cells.

Example

var theme = MarkdownTheme()
theme.spacings.general = 12
theme.spacings.list = 10
theme.spacings.final = 20

Sizes

Controls the size of visual elements.

Declaration

public struct Sizes: Equatable

Properties

bullet
CGFloat
default:"4"
The diameter of bullet points in unordered lists.

Example

var theme = MarkdownTheme()
theme.sizes.bullet = 6

Table

Controls the styling of markdown tables.

Declaration

public struct Table: Equatable

Properties

Border and Shape

cornerRadius
CGFloat
default:"8"
The corner radius applied to table borders.
borderWidth
CGFloat
default:"1"
The width of table borders.
borderColor
UIColor / NSColor
The color of table borders.Default (iOS/visionOS): UIColor.separatorDefault (macOS): NSColor.separatorColor

Cell Colors

headerBackgroundColor
UIColor / NSColor
Background color for table header cells.Default (iOS/visionOS): UIColor.systemGray6Default (macOS): NSColor.windowBackgroundColor
cellBackgroundColor
UIColor / NSColor
Background color for standard table cells.Default: UIColor.clear / NSColor.clear
stripeCellBackgroundColor
UIColor / NSColor
Background color for alternating table rows (striped rows).Default: UIColor.systemGray.withAlphaComponent(0.03) / NSColor.systemGray.withAlphaComponent(0.03)Creates a subtle stripe effect for better readability.

Example

var theme = MarkdownTheme()

// Customize table appearance
theme.table.cornerRadius = 12
theme.table.borderWidth = 2
theme.table.borderColor = .systemGray3

// Customize cell colors
theme.table.headerBackgroundColor = .systemBlue.withAlphaComponent(0.1)
theme.table.stripeCellBackgroundColor = .systemGray.withAlphaComponent(0.05)

Image

Controls the styling of images in markdown content.

Declaration

public struct Image: Equatable

Properties

cornerRadius
CGFloat
default:"4"
The corner radius applied to images.
maxWidthFraction
CGFloat
default:"1.0"
The maximum width of images as a fraction of the available width.
  • 1.0 = 100% of available width
  • 0.5 = 50% of available width
Use values between 0.0 and 1.0 to constrain image width.
placeholderColor
UIColor / NSColor
The color displayed while images are loading.Default (iOS/visionOS): UIColor.systemGray5Default (macOS): NSColor.windowBackgroundColor

Example

var theme = MarkdownTheme()

// Round image corners more
theme.image.cornerRadius = 8

// Limit images to 80% width
theme.image.maxWidthFraction = 0.8

// Custom placeholder color
theme.image.placeholderColor = .systemGray4

Platform Types

All color properties use platform-specific types:
  • iOS/visionOS: UIColor from UIKit
  • macOS: NSColor from AppKit
All size and spacing properties use CGFloat, which is available on all platforms.

Build docs developers (and LLMs) love