Parameters

SevenMark uses one typed parameter capability system across its native syntax, formatter, HTML renderer, server diagnostics, and LSP.

How Parameters Work

The parser accepts generic #key="value" pairs and preserves them in the AST. The shared language specification then defines each canonical parameter name, value type, aliases, and the element targets where it applies. Parameter names support Unicode letters, digits, underscore, and hyphen ([\p{L}\p{N}_-]+).

This means:

• #color, #style, #lang, #caption, and #theme are semantic capabilities, not parser keywords
• Hyphenated keys such as #dark-color and #dark-bgcolor are valid
• A capability has the same meaning and value normalization on every target that declares it. For example, unitless CssLength values mean pixels.
• The formatter writes canonical names and values, the LSP completes and validates the same set, and render responses carry the same diagnostics.
• Unknown, unsupported, non-canonical, and invalid parameters produce warnings without turning otherwise valid content into a broken element.
• Include elements intentionally remain open to custom variable bindings; #namespace is their reserved typed parameter.

NamuMark input is syntax sugar only. Its parser converts compatibility forms to the same canonical SevenMark AST before formatting, rendering, or tooling sees them. NamuMark aliases and conventions do not define a second parameter model.

Parameter Syntax

Parameters use #key="value" for key-value pairs, or #flag for boolean flags where presence means enabled:

{{{ #style="color:red" #size="16px" Red text }}}

{{{#table #caption="Inventory" #sortable
[[#head [[Product]] [[Price]]]]
[[[[Laptop]] [[$1200]]]]
}}}

Quoted Values

Parameter values use double quotes. Quotes inside values can be escaped:

{{{ #style="font-family: \"Arial\", sans-serif" Text }}}

Quoted values are parsed as inline SevenMark content, not as plain unstructured strings. That allows escapes and simple inline markup to be preserved in the parameter value AST. The outer quotes are delimiters and are not part of the stored value.

Parameter Boundaries

For brace elements, parameters appear immediately after the element name or the opening {{{ for styled elements:

``` #lang="rust"
fn main() {}
```

{{{ #class="badge" Inline styled content }}}

For double-bracket links and file media, parameters are only recognized as a prefix when the prefix ends with ||:

[[#class="doc-link" || Guide | Guide label]]

Without that separator, the body is parsed as the target text itself:

[[#class="doc-link" Guide | This target starts with #class text]]

Brace table rows, brace table cells, brace list items, and folds use structural [[...]] segments. Parameters inside those segments belong to the row, cell, or item:

{{{#table
[[#head [[Name]] [[Value]]]]
[[[[#x="2" Wide cell]]]]
}}}

Boolean Flags

Some parameters act as flags:

$$
\sum_{i=1}^{n} x_i
$$

{{{#table #sortable
[[#head [[Name]] [[Value]]]]
[[[[A]] [[1]]]]
}}}

Shared Visual Capabilities

The following capabilities are applied to the stable visual root of every target that supports them. A target-specific parameter is never silently reinterpreted as a different common capability.

Parameter	Description	Common Usage
#style	Raw inline CSS declarations	Styled blocks, tables, lists, links, media wrappers
#color	Text color	Styled blocks and style-aware renderers
#bgcolor	Background color	Styled blocks and style-aware renderers
#size	Font size (CssLength; unitless values are pixels)	Styled blocks and style-aware renderers
#opacity	Opacity	Styled blocks and style-aware renderers
#class	Extra CSS class names	Many block, link, and media renderers
#onclick	Constrained class actions on click	Non-navigation visual roots such as styled blocks, tables, rows, cells, lists, folds, quotes, code, and ruby
#dark-style	Raw dark-mode CSS declarations	Visual renderers that emit data-dk and participate in the shared dark-style registry
#dark-color	Dark-mode text color	Visual renderers that emit data-dk and participate in the shared dark-style registry
#dark-bgcolor	Dark-mode background color	Visual renderers that emit data-dk and participate in the shared dark-style registry
#dark-size	Dark-mode font size (CssLength)	Visual renderers that emit data-dk and participate in the shared dark-style registry
#dark-opacity	Dark-mode opacity	Visual renderers that emit data-dk and participate in the shared dark-style registry

#dark-* parameters are separate from provider-specific flags like #dark on some external media embeds such as Spotify or Discord.

Click Class Actions

#onclick is not JavaScript. Renderers validate it as a small action language and emit safe metadata for SevenMark clients to hydrate.

Allowed actions are:

• add-class,target-class,class-name
• remove-class,target-class,class-name
• toggle-class,target-class,class-name

Multiple actions can be joined with ; and run in order:

{{{ #class="tab tab-a selected" #onclick="remove-class,tab,selected;add-class,tab-a,selected"
Open A
}}}
{{{ #class="tab tab-b" #onclick="remove-class,tab,selected;add-class,tab-b,selected"
Open B
}}}

Class action tokens use ASCII letters, digits, _, and -. Invalid actions are ignored by the HTML renderer. Link and media navigation roots do not use #onclick; navigation behavior should stay explicit.

Element-specific Parameters

Tables

Table-level parameters:

• #caption: render a <caption>
• #wrapper-align: align the table wrapper (left, center, or right)
• #wrapper-width: set a fixed width on the wrapper div
• #wrapper-style: arbitrary light-mode CSS on the wrapper (shared stylesheet, data-lk)
• #wrapper-dark-style: dark-mode CSS on the wrapper (data-dk)
• #sortable: emit data-sortable="true" for sortable-table behavior
• #onclick: constrained class actions on the rendered table root

Row-level parameters:

• #head: render the row inside <thead> with <th> cells
• #onclick: constrained class actions on the rendered <tr>

Cell-level parameters:

• #x: colspan
• #y: rowspan
• #onclick: constrained class actions on the rendered <td> or <th>

{{{#table #caption="Inventory" #wrapper-align="right" #sortable
[[#head [[Product]] [[Price]]]]
[[[[#x="2" Featured item]] [[In stock]]]]
}}}

Links and Media

Double-bracket links and file media can start with a parameter prefix. The prefix must end with ||; the text after || is the target/display syntax.

• Link and file targets are written as target text, not as target parameters.
• #style, #class, and #dark-* style the rendered link or media wrapper.
• #theme="light" and #theme="dark" annotate file: media with data-theme="light|dark"; other values are ignored.
• File media also supports typed #width, #height, #fit, and #align parameters from the shared language specification.

[[#class="doc-link" || Guide#installation | Jump to installation]]
[[#theme="dark" || file:logo-dark.svg | Dark logo]]

Footnotes

Footnotes commonly use:

• #display: custom marker text for unnamed footnotes
• #name: reusable named footnote identifier

Text{{{#fn #display="*" Note with custom marker. }}}.
Again{{{#fn #name="api-limit" Shared note. }}}.

Code and CSS Blocks

Common parameters include:

• #lang on fenced code blocks for syntax highlighting
• #class on fenced code blocks
• #onclick on fenced code blocks
• #dark-* on visual renderers such as fenced code blocks to populate shared dark-mode styling rules

{{{#css}}} does not accept parameters; write dark-mode selectors directly in the authored stylesheet.

``` #lang="rust" #class="example" #dark-bgcolor="#111" #dark-color="#eee"
fn main() {}
```

Parameter Combinations

Multiple parameters can be combined:

{{{ #style="border:2px solid blue; padding:8px" #color="red" #size="18px"
Multi-styled text
}}}

[[#theme="light" #width="180px" || file:logo-light.svg | Light logo]]

Nested Parameter Usage

Parameters work in nested structures:

{{{#table #caption="Nested examples"
[[#head [[Name]] [[Content]]]]
[[[[Code]] [[``` #lang="python" #class="nested"
print("hello")
```
]]]]
[[[[Media]] [[[[#theme="dark" || file:image.png | Example]]]]]]
}}}