An useful alias to indicate that an element can be either of block or inline type.

Alias to represent a collection of CSS classes.

Useful alias to indicate that a sequence of Entry can be used to add data- prefixed attributes to the element.

Useful alias to indicate that a sequence of Entry can be used to add any nonstandard attribute to the element.

Hints to the user agent that the user agent can put the user's needs first without risk to the server, up to and including optimistically downloading the entire resource.

Indicates that the contents of the element are explicitly embedded text, but that the direction is to be determined programmatically using the contents of the element.

Block tags are often represented by an opening and a closing tag, with content/children between.

Do nothing. The action must be specified by the user.

Defines a checkbox control. The data type is a set of zero or more values from a predefined list.

Defines a color picker control. The data type is an sRGB color with 8-bit red, green, and blue components.

Indicates that dropping an accepted item on the element will result in a copy of the dragged data.

Defines a date control. The data type is a date (year, month, day) with no time zone.

A date and time control. The data type is a date and time (year, month, day, hour, minute, second, fraction of a second) with the time zone set to UTC.

A date and time control. The data type is a date and time (year, month, day, hour, minute, second, fraction of a second) with no time zone.

A text field with an e-mail address or list of e-mail addresses.

Empty tags are self-contained. They open and close with no text content nor children.

Defines a file-select field and a 'Browse…' button (for file uploads).

Latin-script input in the user's secondary language(s), using full-width characters, with aggressive typing aids intended for human-to-human communications enabled (e.g.text prediction and automatic capitalisation at the start of sentences).

Indicates that the text in the textarea is to have newlines added by the user agent so that the text is wrapped when it is submitted.

Defines a hidden input field that can hold any String as value.

Defines an image as a submit button.

Kana or romaji input, typically hiragana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.

Katakana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.

Latin-script input in the user's preferred language(s), with some typing aids enabled (e.g. text prediction).

Latin-script input in the user's preferred language(s), with typing aids intended for entering human names enabled (e.g. text prediction from the user's contact list and automatic capitalisation at every word).

Latin-script input in the user's preferred language(s), with aggressive typing aids intended for human-to-human communications enabled (e.g. text prediction and automatic capitalisation at the start of sentences).

Indicates that the contents of the element are explicitly directionally embedded left-to-right text.

Indicates that dropping an accepted item on the element will result in a link to the original data.

Hints to the user agent that the author does not expect the user to need the media resource, but that fetching the resource metadata (dimensions, track list, duration, etc), and maybe even the first few frames, is reasonable.

A month control. The data type is a date consisting of a year and a month with no time zone.

Indicates that dropping an accepted item on the element will result in the dragged data being moved to the new location.

Hints to the user agent that either the author does not expect the user to need the media resource, or that the server wants to minimize unnecessary traffic.

If the element has a form owner, the element must reset the form owner.

Indicates that the contents of the element are explicitly directionally embedded right-to-left text.

Indicates that the text in the textarea is not to be wrapped when it is submitted (though it can still be wrapped in the rendering).

If the element has a form owner, the element must submit the form owner

A time control. The data type is a time (hour, minute, seconds, fractional seconds) with no time zone.

Alphanumeric Latin-script input of non-prose content, e.g. usernames, passwords, product codes.

A week control. The data type is a date consisting of a year and a month with no time zone.

Block level elements normally start (and end) with a new line when displayed in a browser.

Represents the entire HTML document, this means that it holds the entire configuration and content. Conceptually, it is the root of the document tree.

Enumerated type used to group elements with common behavior about how they are rendered and how they relate to each other. This interface is useful to empower proper and semantic HTML writing by API design, enforcing constraints at compile time:

P {
    Span("Paragraph elements can have inline elements
          as children, like a span..."),
    Div("But not block elements, like a div!") // compilation error
};

Inline elements are normally displayed without starting a new line. Note: if you want to properly customize inline elements' sizing properties you must style them with display: inline-block;

Represents a single node in the Document tree. This is the base type for the entire Document Object Model. More detailed info can be found at DOM Level 2 Specification

Marks a Node implementation as a possible parent of other nodes.

It's basically a factory of Node. Implement this interface to create reusable HTML fragments.

For example a snippet to build a modal dialog, like this:

shared class Dialog(String title, Boolean closeable = true,
             Div body, Button* buttons = {})
         satisfies Snippet<Div> {

     content => Div {
         classNames = "modal";
         Aria {
             role = dialog;
         };
         Div {
             classNames = "modal-header";
             H4(title),
             closeable then Button {
                 "&times;";
                 classNames = "close";
             }
         },
         Div {
             classNames = "modal-body";
             body
         },
         Div {
             classNames = "modal-footer";
             buttons
         }
     }
}

An special type of element that's available only as Table child nodes.

Marks a Node implementation as a text container.

Represents a hyperlink, which is used to link from one page to another through the A.href attribute.

Technical details about this element can be found on the Official W3C reference

Represents an abbreviation or acronym. The optional BaseElement.title attribute may be used to provide an expansion of the abbreviation.

Technical details about this element can be found on the Official W3C reference

Represents a section of a page that consists of a composition that forms an independent part of a document. This could be a forum post, a magazine or newspaper article for example.

Technical details about this element can be found on the Official W3C reference

Represents a section of a page consisting of content that is tangentially related to the content around the aside element, and which could be considered separate from that content.

Technical details about this element can be found on the Official W3C reference

Represents a sound or audio stream.

Technical details about this element can be found on the Official W3C reference

Represents a span of text to be stylistically offset from the normal prose without conveying any extra importance. Examples are key words in a document abstract, product names in a review, or other spans of text whose typical typographic presentation is bold.

Technical details about this element can be found on the Official W3C reference

A default Element implementation that represents a full featured HTML element. It defines all common HTML attributes and event handling.

Represents a section that is quoted from another source.
Technical details about this element can be found on the Official W3C reference

Represents the main content of the Document.

Technical details about this element can be found on the Official W3C reference

Represents a line break. Must be used only for line breaks that are actually part of the content, don't use in paragraphs.

Technical details about this element can be found on the Official W3C reference

Represents a button.

Technical details about this element can be found on the Official W3C reference

Controls the behavior of the button when it is activated.

Technical details about this attribute can be found on the Official W3C reference

Utility class to easily express a charset metadata for the Document.

represents the title of a work (e.g. a book, a paper, an essay, a poem, a score, a song, a script, a film, etc). This can be a work that is being quoted or referenced in detail (i.e. a citation), or it can just be a work that is mentioned in passing.

Technical details about this element can be found on the Official W3C reference

The code element represents a fragment of computer code.

Technical details about this element can be found on the Official W3C reference

Utility Link extension representing an CSS resource.

Represents a set of option elements that represent predefined options for other controls. In the rendering, the datalist element represents nothing and it, along with its children, should be hidden.

Technical details about this element can be found on the Official W3C reference

Represents the description, definition, or value, part of a term-description group in a description list.

Technical details about this element can be found on the Official W3C reference

Represents a removal from the document. The del elements should not cross implied paragraph boundaries.

Technical details about this element can be found on the Official W3C reference

Represents the defining instance of a term. The paragraph, description list group, or section that is the nearest ancestor of the dfn element must also contain the definition(s) for the term given by the dfn element.

Technical details about this element can be found on the Official W3C reference

This element has no special meaning, but it's very useful for semantic element grouping as a block. Basically a div represents its children, using CSS classes to mark up semantics common to a group of consecutive elements (like a gallery of image thumbs, for example):

Div {
    classNames = "gallery";
    Div {
        classNames = "thumb";
    },
    // ... more thumbs
    Div {
        classNames = "thumb";
    }
}

If you want to group elements in a inline manner, see Span

Technical details about this element can be found on the Official W3C reference

Represents a description list consisting of zero or more name (Dt) and value (Dd) groups.

Technical details about this element can be found on the Official W3C reference

The document type. It provides information about how the Document shall be defined and serialized.

Defines the behavior of a drop zone element.

Represents the term, or name, part of a term-description group in a description list.

Technical details about this element can be found on the Official W3C reference

Implementations of this class represents a concrete element used to display formatted content, to define metadata or to import external resources of a Document. This base class defines the id, common to all elements.

Represents stress emphasis of its contents.

Technical details about this element can be found on the Official W3C reference

Represents a group of form controls, optionally described by a FieldSet.legend.

Technical details about this element can be found on the Official W3C reference

Represents the “footer” of a document or section of a document. The footer element typically contains metadata about its enclosing section, such as who wrote it, links to related documents, copyright data, etc.

Technical details about this element can be found on the Official W3C reference

Represents a collection of form-associated elements, some of which can represent editable values that can be submitted to a server for processing.

Technical details about this element can be found on the Official W3C reference

Base class for form control elements.

This is the highest level heading.

This is the level two heading.

This is the level three heading.

This is the level four heading.

This is the level 5 heading.

This is the lowest level heading.

Groups the metadata of the Html document, such as page description, links to resources, stylesheets and scripts.

Represents the “header” of a document or section of a document. The header element is typically used to group a set of h1–h6 elements to mark up a page's title with its subtitle or tagline.

Technical details about this element can be found on the Official W3C reference

Base class for heading (h1-6) elements. They represent headings and subheadings in a Document. These elements rank in importance according to the number in their name (Heading.level).

Technical details about this element can be found on the Official W3C reference

Represents a paragraph-level thematic break. The 'paragraph-level' bit means between blocks of text, so it shouldn't be used to separate sections of a site.

Technical details about this element can be found on the Official W3C reference

Represents a span of text in an alternate voice or mood, or otherwise offset from the normal prose.

Technical details about this element can be found on the Official W3C reference

Represents an image. The image given by the Img.src attribute, and the value of the Img.alt attribute is the img element's fallback text content in case the source is not found.

Technical details about this element can be found on the Official W3C reference

Represents a typed data field, usually with a form control to allow the user to edit the data.

Technical details about this element can be found on the Official W3C reference

Specifies what kind of input mechanism would be most helpful for users entering content into the form input.

Technical details about this attribute can be found on the Official W3C reference

Controls the data type (and associated control) of the element.

Technical details about this attribute can be found on the Official W3C reference

Represents an addition to the document. The ins elements should not cross implied paragraph boundaries.

Technical details about this element can be found on the Official W3C reference

Represents user input (typically keyboard input, although it may also be used to represent other input, such as voice commands).

Technical details about this element can be found on the Official W3C reference

Represents a caption in a user interface. The caption can be associated with a specific form control (through the Label.forControl attribute).

Technical details about this element can be found on the Official W3C reference

Represents a caption for the rest of the contents of the parent FieldSet.

Technical details about this element can be found on the Official W3C reference

Represents a list item.

Technical details about this element can be found on the Official W3C reference

Defines a relationship between the Html and an external resource.

The relationship kind between the current document and the linked document.

Represents a run of text in one document marked or highlighted because of its relevance in another context.

Technical details about this element can be found on the Official W3C reference

Base class for media elements, such as Audio and Video.

Used to specify if and how the author thinks the media should be loaded when the page loads.

Technical details about this attribute can be found on the Official W3C reference

The meta element represents various kinds of metadata expressed through pairs of Meta.name and Meta.content.

Technical details about this element can be found on the Official W3C reference

Represents navigation for a document. The nav element is a section containing links to other documents or to parts within the current document.

Technical details about this element can be found on the Official W3C reference

Represents a list of items, where the items (Li) have been intentionally ordered. Also known as numbered-list.

Technical details about this element can be found on the Official W3C reference

Represents an option in a Select or as part of a list of suggestions in a DataList element.

Technical details about this element can be found on the Official W3C reference

Represents a group of Option elements with a common label.

Technical details about this element can be found on the Official W3C reference

Represents a paragraph. Technical details about this element can be found on the Official W3C reference

Represents a block of preformatted text, in which structure is represented by typographic conventions rather than by elements.

Technical details about this element can be found on the Official W3C reference

Represents some phrasing content quoted from another source.

Technical details about this element can be found on the Official W3C reference

Represents contents that are no longer accurate or no longer relevant.

Technical details about this element can be found on the Official W3C reference

Represents (sample) output from a program or computing system.

Technical details about this element can be found on the Official W3C reference

Allows authors to include dynamic script and data blocks in their documents. The element does not represent content for the user.

Technical details about this element can be found on the Official W3C reference

Represents a generic document or application section. In this context, a section is a thematic grouping of content, typically with a Header, possibly with a Footer. Examples include chapters in a book or the various tabbed pages in a tabbed dialog box.

Technical details about this element can be found on the Official W3C reference

Represents a control for selecting amongst a set of options.

Technical details about this element can be found on the Official W3C reference

Represents side comments such as small print. It is not intended to be presentational. It is only intended for short runs of text.

Technical details about this element can be found on the Official W3C reference

Allows authors to specify multiple alternative media resources for media elements. It does not represent anything on its own.

This element has no special meaning, but it's very useful for semantic element grouping in a inline manner. Basically a span represents its children, using CSS classes to mark up semantics common to a group of consecutive elements (like a gallery of image thumbs, for example):

Span {
    "Text";
    classNames = "label";
    Img {
        src = "images/close.png";
    }
}

If you want to group elements in a block, see Div

Technical details about this element can be found on the Official W3C reference

Represents strong importance for its contents.

Technical details about this element can be found on the Official W3C reference

Implementations of this class represents an element that can be styled using CSS.

Represents a subscript of its contents.

Technical details about this element can be found on the Official W3C reference

Represents a superscript of its contents.

Technical details about this element can be found on the Official W3C reference

Represents tabular data. It is advised against the use of tables for layout purposes (use Div instead).

Technical details about this element can be found on the Official W3C reference

Represents a tag, which is the actual text representation of a Node. For example: <div></div> is the tag for the Div element.

The Tag type, which can be blockTag or emptyTag.

Represents a data cell in a Table.

Technical details about this element can be found on the Official W3C reference

Represents a multiline plain text edit control for the element's raw value.

Technical details about this element can be found on the Official W3C reference

Specifies how the text in a text area is to be wrapped when submitted in a form.

Technical details about this attribute can be found on the Official W3C reference

The text directionality. For details, check Official W3C Specification

Represents a header cell in a Table.

Technical details about this element can be found on the Official W3C reference

Represents the title node, present only on the head of the document.

Represents a row of cells (Td) in a Table.

Technical details about this element can be found on the Official W3C reference

Represents a span of text with an unarticulated, though explicitly rendered, non-textual annotation, such as labeling the text as being a proper name in a foreign language.

Technical details about this element can be found on the Official W3C reference

Represents a list of items (Li), where the order of the items is not important. Also known as bullet-list.

Technical details about this element can be found on the Official W3C reference

Represents a variable. This could be an actual variable in a mathematical expression or programming context, or it could just be a term used as a placeholder in prose.

Technical details about this element can be found on the Official W3C reference

Represents a video or movie.

Technical details about this element can be found on the Official W3C reference

Represents a line break opportunity. Any content inside must not be considered part of the surrounding text.

Technical details about this element can be found on the Official W3C reference

Hints to the user agent that the user agent can put the user's needs first without risk to the server, up to and including optimistically downloading the entire resource.

Indicates that the contents of the element are explicitly embedded text, but that the direction is to be determined programmatically using the contents of the element.

Block tags are often represented by an opening and a closing tag, with content/children between.

Do nothing. The action must be specified by the user.

Defines a checkbox control. The data type is a set of zero or more values from a predefined list.

Defines a color picker control. The data type is an sRGB color with 8-bit red, green, and blue components.

Indicates that dropping an accepted item on the element will result in a copy of the dragged data.

Defines a date control. The data type is a date (year, month, day) with no time zone.

A date and time control. The data type is a date and time (year, month, day, hour, minute, second, fraction of a second) with the time zone set to UTC.

A date and time control. The data type is a date and time (year, month, day, hour, minute, second, fraction of a second) with no time zone.

A text field with an e-mail address or list of e-mail addresses.

Empty tags are self-contained. They open and close with no text content nor children.

Defines a file-select field and a 'Browse…' button (for file uploads).

Latin-script input in the user's secondary language(s), using full-width characters, with aggressive typing aids intended for human-to-human communications enabled (e.g.text prediction and automatic capitalisation at the start of sentences).

Indicates that the text in the textarea is to have newlines added by the user agent so that the text is wrapped when it is submitted.

Defines a hidden input field that can hold any String as value.

Defines an image as a submit button.

Kana or romaji input, typically hiragana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.

Katakana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.

Latin-script input in the user's preferred language(s), with some typing aids enabled (e.g. text prediction).

Latin-script input in the user's preferred language(s), with typing aids intended for entering human names enabled (e.g. text prediction from the user's contact list and automatic capitalisation at every word).

Latin-script input in the user's preferred language(s), with aggressive typing aids intended for human-to-human communications enabled (e.g. text prediction and automatic capitalisation at the start of sentences).

Indicates that the contents of the element are explicitly directionally embedded left-to-right text.

Indicates that dropping an accepted item on the element will result in a link to the original data.

Hints to the user agent that the author does not expect the user to need the media resource, but that fetching the resource metadata (dimensions, track list, duration, etc), and maybe even the first few frames, is reasonable.

A month control. The data type is a date consisting of a year and a month with no time zone.

Indicates that dropping an accepted item on the element will result in the dragged data being moved to the new location.

Hints to the user agent that either the author does not expect the user to need the media resource, or that the server wants to minimize unnecessary traffic.

If the element has a form owner, the element must reset the form owner.

Indicates that the contents of the element are explicitly directionally embedded right-to-left text.

Indicates that the text in the textarea is not to be wrapped when it is submitted (though it can still be wrapped in the rendering).

If the element has a form owner, the element must submit the form owner

A time control. The data type is a time (hour, minute, seconds, fractional seconds) with no time zone.

Alphanumeric Latin-script input of non-prose content, e.g. usernames, passwords, product codes.

A week control. The data type is a date consisting of a year and a month with no time zone.