Reference

<a> element

Baseline and scoped. Style actual hyperlinks through a[href] with a visible link cue and focus indicator. A navigation link may use the button skin while retaining its destination. Use aria-current for the current item when applicable.

<abbr> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<b> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<cite> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<data> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<del> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<dfn> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<em> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<i> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<ins> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<mark> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<q> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<s> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<small> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<span> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<strong> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<time> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<u> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<var> element

Baseline and scoped. Preserve the distinctions expressed by emphasis, quotes, edits, annotations, and highlights. Keep authored value, datetime, and cite semantics. Use a span as a neutral hook. Keep important information available as text.

<acronym> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<big> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<center> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<content> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<dir> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<font> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<frame> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<frameset> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<image> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<marquee> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<menuitem> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<nobr> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<noembed> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<noframes> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<param> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<plaintext> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<rb> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<rtc> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<shadow> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<strike> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<tt> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<xmp> element

No stable skin. Migrate markup to current HTML. Use abbr for abbreviations, img for images, CSS for alignment and type, and slot for shadow insertion points.

<address> element

Scoped. Style the chosen landmark or section with a class. Use article when content stands independently, nav for navigation, and search for a named search task. Keep filters that refine the current view as forms when they do not represent a separate search task. The class does not supply a landmark or its name.

<article> element

Scoped. Style the chosen landmark or section with a class. Use article when content stands independently, nav for navigation, and search for a named search task. Keep filters that refine the current view as forms when they do not represent a separate search task. The class does not supply a landmark or its name.

<aside> element

Scoped. Style the chosen landmark or section with a class. Use article when content stands independently, nav for navigation, and search for a named search task. Keep filters that refine the current view as forms when they do not represent a separate search task. The class does not supply a landmark or its name.

<footer> element

Scoped. Style the chosen landmark or section with a class. Use article when content stands independently, nav for navigation, and search for a named search task. Keep filters that refine the current view as forms when they do not represent a separate search task. The class does not supply a landmark or its name.

<header> element

Scoped. Style the chosen landmark or section with a class. Use article when content stands independently, nav for navigation, and search for a named search task. Keep filters that refine the current view as forms when they do not represent a separate search task. The class does not supply a landmark or its name.

<main> element

Scoped. Style the chosen landmark or section with a class. Use article when content stands independently, nav for navigation, and search for a named search task. Keep filters that refine the current view as forms when they do not represent a separate search task. The class does not supply a landmark or its name.

<nav> element

Scoped. Style the chosen landmark or section with a class. Use article when content stands independently, nav for navigation, and search for a named search task. Keep filters that refine the current view as forms when they do not represent a separate search task. The class does not supply a landmark or its name.

<search> element

Scoped. Style the chosen landmark or section with a class. Use article when content stands independently, nav for navigation, and search for a named search task. Keep filters that refine the current view as forms when they do not represent a separate search task. The class does not supply a landmark or its name.

<section> element

Scoped. Style the chosen landmark or section with a class. Use article when content stands independently, nav for navigation, and search for a named search task. Keep filters that refine the current view as forms when they do not represent a separate search task. The class does not supply a landmark or its name.

<area> element

Baseline and browser. Let images shrink within their container while preserving intrinsic aspect ratio. Use authored sizes and alternatives. Style the rendered image, and preserve responsive source selection and image map hit areas.

<img> element

Baseline and browser. Let images shrink within their container while preserving intrinsic aspect ratio. Use authored sizes and alternatives. Style the rendered image, and preserve responsive source selection and image map hit areas.

<map> element

Baseline and browser. Let images shrink within their container while preserving intrinsic aspect ratio. Use authored sizes and alternatives. Style the rendered image, and preserve responsive source selection and image map hit areas.

<picture> element

Baseline and browser. Let images shrink within their container while preserving intrinsic aspect ratio. Use authored sizes and alternatives. Style the rendered image, and preserve responsive source selection and image map hit areas.

<source> element

Baseline and browser. Let images shrink within their container while preserving intrinsic aspect ratio. Use authored sizes and alternatives. Style the rendered image, and preserve responsive source selection and image map hit areas.

<audio> element

Baseline and browser. Constrain the player to available width. Keep controls, captions, and alternative media usable. Style media controls or caption cues only within a specific, tested treatment.

<track> element

Baseline and browser. Constrain the player to available width. Keep controls, captions, and alternative media usable. Style media controls or caption cues only within a specific, tested treatment.

<video> element

Baseline and browser. Constrain the player to available width. Keep controls, captions, and alternative media usable. Style media controls or caption cues only within a specific, tested treatment.

<base> element

Browser. These configure the document and its resources. Keep them outside the visual styling API.

<head> element

Browser. These configure the document and its resources. Keep them outside the visual styling API.

<link> element

Browser. These configure the document and its resources. Keep them outside the visual styling API.

<meta> element

Browser. These configure the document and its resources. Keep them outside the visual styling API.

<script> element

Browser. These configure the document and its resources. Keep them outside the visual styling API.

<style> element

Browser. These configure the document and its resources. Keep them outside the visual styling API.

<title> element

Browser. These configure the document and its resources. Keep them outside the visual styling API.

<bdi> element

Browser with scoped typography. Respect authored lang and dir, optional and forced break opportunities, and native ruby and baseline positioning. Scope any typographic adjustments to the relevant content.

<bdo> element

Browser with scoped typography. Respect authored lang and dir, optional and forced break opportunities, and native ruby and baseline positioning. Scope any typographic adjustments to the relevant content.

<br> element

Browser with scoped typography. Respect authored lang and dir, optional and forced break opportunities, and native ruby and baseline positioning. Scope any typographic adjustments to the relevant content.

<rp> element

Browser with scoped typography. Respect authored lang and dir, optional and forced break opportunities, and native ruby and baseline positioning. Scope any typographic adjustments to the relevant content.

<rt> element

Browser with scoped typography. Respect authored lang and dir, optional and forced break opportunities, and native ruby and baseline positioning. Scope any typographic adjustments to the relevant content.

<ruby> element

Browser with scoped typography. Respect authored lang and dir, optional and forced break opportunities, and native ruby and baseline positioning. Scope any typographic adjustments to the relevant content.

<sub> element

Browser with scoped typography. Respect authored lang and dir, optional and forced break opportunities, and native ruby and baseline positioning. Scope any typographic adjustments to the relevant content.

<sup> element

Browser with scoped typography. Respect authored lang and dir, optional and forced break opportunities, and native ruby and baseline positioning. Scope any typographic adjustments to the relevant content.

<wbr> element

Browser with scoped typography. Respect authored lang and dir, optional and forced break opportunities, and native ruby and baseline positioning. Scope any typographic adjustments to the relevant content.

<blockquote> element

Baseline and scoped. Use a prose scope for rhythm and reading measure. Preserve preformatted whitespace and give long lines a usable scroll or wrap policy. Use a thematic break for hr and a neutral div for grouping.

<div> element

Baseline and scoped. Use a prose scope for rhythm and reading measure. Preserve preformatted whitespace and give long lines a usable scroll or wrap policy. Use a thematic break for hr and a neutral div for grouping.

<hr> element

Baseline and scoped. Use a prose scope for rhythm and reading measure. Preserve preformatted whitespace and give long lines a usable scroll or wrap policy. Use a thematic break for hr and a neutral div for grouping.

<p> element

Baseline and scoped. Use a prose scope for rhythm and reading measure. Preserve preformatted whitespace and give long lines a usable scroll or wrap policy. Use a thematic break for hr and a neutral div for grouping.

<pre> element

Baseline and scoped. Use a prose scope for rhythm and reading measure. Preserve preformatted whitespace and give long lines a usable scroll or wrap policy. Use a thematic break for hr and a neutral div for grouping.

<body> element

Baseline. Set the theme, inherited type, foreground and background, and document sizing. Keep user zoom and text scaling. Use scoped layouts to size sections within the document.

<html> element

Baseline. Set the theme, inherited type, foreground and background, and document sizing. Keep user zoom and text scaling. Use scoped layouts to size sections within the document.

<button> element

Scoped and browser. Apply skins directly to controls. Preserve browser handling of typing, autofill, keyboard selection, focus, and submission. The matrix below covers every input type and picker boundary.

<datalist> element

Scoped and browser. Apply skins directly to controls. Preserve browser handling of typing, autofill, keyboard selection, focus, and submission. The matrix below covers every input type and picker boundary.

<input> element

Scoped and browser. Apply skins directly to controls. Preserve browser handling of typing, autofill, keyboard selection, focus, and submission. The matrix below covers every input type and picker boundary.

<optgroup> element

Scoped and browser. Apply skins directly to controls. Preserve browser handling of typing, autofill, keyboard selection, focus, and submission. The matrix below covers every input type and picker boundary.

<option> element

Scoped and browser. Apply skins directly to controls. Preserve browser handling of typing, autofill, keyboard selection, focus, and submission. The matrix below covers every input type and picker boundary.

<select> element

Scoped and browser. Apply skins directly to controls. Preserve browser handling of typing, autofill, keyboard selection, focus, and submission. The matrix below covers every input type and picker boundary.

<selectedcontent> element

Scoped and browser. Apply skins directly to controls. Preserve browser handling of typing, autofill, keyboard selection, focus, and submission. The matrix below covers every input type and picker boundary.

<textarea> element

Scoped and browser. Apply skins directly to controls. Preserve browser handling of typing, autofill, keyboard selection, focus, and submission. The matrix below covers every input type and picker boundary.

<canvas> element

Scoped and browser. Size the outer surface and preserve accessible titles, object fallback, and canvas fallback. An iframe owns its own document and styles. Changing a canvas's CSS size is separate from changing its drawing resolution.

<embed> element

Scoped and browser. Size the outer surface and preserve accessible titles, object fallback, and canvas fallback. An iframe owns its own document and styles. Changing a canvas's CSS size is separate from changing its drawing resolution.

<iframe> element

Scoped and browser. Size the outer surface and preserve accessible titles, object fallback, and canvas fallback. An iframe owns its own document and styles. Changing a canvas's CSS size is separate from changing its drawing resolution.

<object> element

Scoped and browser. Size the outer surface and preserve accessible titles, object fallback, and canvas fallback. An iframe owns its own document and styles. Changing a canvas's CSS size is separate from changing its drawing resolution.

<caption> element

Baseline and scoped. Keep table layout, captions, header associations, and numeric alignment. Put overflow on an outer container when needed. Use column elements only for the CSS properties browsers apply to columns.

<col> element

Baseline and scoped. Keep table layout, captions, header associations, and numeric alignment. Put overflow on an outer container when needed. Use column elements only for the CSS properties browsers apply to columns.

<colgroup> element

Baseline and scoped. Keep table layout, captions, header associations, and numeric alignment. Put overflow on an outer container when needed. Use column elements only for the CSS properties browsers apply to columns.

<table> element

Baseline and scoped. Keep table layout, captions, header associations, and numeric alignment. Put overflow on an outer container when needed. Use column elements only for the CSS properties browsers apply to columns.

<tbody> element

Baseline and scoped. Keep table layout, captions, header associations, and numeric alignment. Put overflow on an outer container when needed. Use column elements only for the CSS properties browsers apply to columns.

<td> element

Baseline and scoped. Keep table layout, captions, header associations, and numeric alignment. Put overflow on an outer container when needed. Use column elements only for the CSS properties browsers apply to columns.

<tfoot> element

Baseline and scoped. Keep table layout, captions, header associations, and numeric alignment. Put overflow on an outer container when needed. Use column elements only for the CSS properties browsers apply to columns.

<th> element

Baseline and scoped. Keep table layout, captions, header associations, and numeric alignment. Put overflow on an outer container when needed. Use column elements only for the CSS properties browsers apply to columns.

<thead> element

Baseline and scoped. Keep table layout, captions, header associations, and numeric alignment. Put overflow on an outer container when needed. Use column elements only for the CSS properties browsers apply to columns.

<tr> element

Baseline and scoped. Keep table layout, captions, header associations, and numeric alignment. Put overflow on an outer container when needed. Use column elements only for the CSS properties browsers apply to columns.

<code> element

Baseline and scoped. Use monospace defaults. Add a scoped keycap or inline code treatment where useful. Keep keyboard sequences readable at larger text sizes.

<kbd> element

Baseline and scoped. Use monospace defaults. Add a scoped keycap or inline code treatment where useful. Keep keyboard sequences readable at larger text sizes.

<samp> element

Baseline and scoped. Use monospace defaults. Add a scoped keycap or inline code treatment where useful. Keep keyboard sequences readable at larger text sizes.

<dd> element

Baseline and scoped. Preserve markers, numbering, list order, and term/description relationships. A list can also be a Stack, Grid, or Cluster. Suppress markers only in a deliberate component and verify list semantics in its accessibility tree.

<dl> element

Baseline and scoped. Preserve markers, numbering, list order, and term/description relationships. A list can also be a Stack, Grid, or Cluster. Suppress markers only in a deliberate component and verify list semantics in its accessibility tree.

<dt> element

Baseline and scoped. Preserve markers, numbering, list order, and term/description relationships. A list can also be a Stack, Grid, or Cluster. Suppress markers only in a deliberate component and verify list semantics in its accessibility tree.

<li> element

Baseline and scoped. Preserve markers, numbering, list order, and term/description relationships. A list can also be a Stack, Grid, or Cluster. Suppress markers only in a deliberate component and verify list semantics in its accessibility tree.

<menu> element

Baseline and scoped. Preserve markers, numbering, list order, and term/description relationships. A list can also be a Stack, Grid, or Cluster. Suppress markers only in a deliberate component and verify list semantics in its accessibility tree.

<ol> element

Baseline and scoped. Preserve markers, numbering, list order, and term/description relationships. A list can also be a Stack, Grid, or Cluster. Suppress markers only in a deliberate component and verify list semantics in its accessibility tree.

<ul> element

Baseline and scoped. Preserve markers, numbering, list order, and term/description relationships. A list can also be a Stack, Grid, or Cluster. Suppress markers only in a deliberate component and verify list semantics in its accessibility tree.

role="toolbar" element

Group a set of controls and provide the keyboard interaction expected of a toolbar.

<details> element

Scoped and browser. Style native disclosure using open and keep the summary operable. Use shared name only for intentionally exclusive disclosures. Style modal dialogs, their backdrops, and the document fallback. Preserve native dismissal and focus behavior. Popover attributes can apply to standard elements without introducing another tag.

<dialog> element

Scoped and browser. Style native disclosure using open and keep the summary operable. Use shared name only for intentionally exclusive disclosures. Style modal dialogs, their backdrops, and the document fallback. Preserve native dismissal and focus behavior. Popover attributes can apply to standard elements without introducing another tag.

<summary> element

Scoped and browser. Style native disclosure using open and keep the summary operable. Use shared name only for intentionally exclusive disclosures. Style modal dialogs, their backdrops, and the document fallback. Preserve native dismissal and focus behavior. Popover attributes can apply to standard elements without introducing another tag.

popover element

Use a native popover with a named trigger and preserve an in-flow or full-page destination.

<fencedframe> element

No stable skin. Review experimental features in a lab with a working fallback.

<geolocation> element

No stable skin. Review experimental features in a lab with a working fallback.

<fieldset> element

Baseline and scoped. Keep labelled native controls, related-control grouping, native submission and reset, and explicit help and error associations. Apply layout to the form or field group. Labels remain visible and usable with CSS off.

<form> element

Baseline and scoped. Keep labelled native controls, related-control grouping, native submission and reset, and explicit help and error associations. Apply layout to the form or field group. Labels remain visible and usable with CSS off.

<label> element

Baseline and scoped. Keep labelled native controls, related-control grouping, native submission and reset, and explicit help and error associations. Apply layout to the form or field group. Labels remain visible and usable with CSS off.

<legend> element

Baseline and scoped. Keep labelled native controls, related-control grouping, native submission and reset, and explicit help and error associations. Apply layout to the form or field group. Labels remain visible and usable with CSS off.

<figcaption> element

Baseline and scoped. Keep the caption with its figure. Use a class for media framing, caption position, or deliberate cropping.

<figure> element

Baseline and scoped. Keep the caption with its figure. Use a class for media framing, caption position, or deliberate cropping.

<h1> element

Baseline and scoped. Give all six heading levels readable defaults. Set size and rhythm within the composition when needed. Keep heading rank in HTML and preserve the grouping of the heading with its supporting copy.

<h2> element

Baseline and scoped. Give all six heading levels readable defaults. Set size and rhythm within the composition when needed. Keep heading rank in HTML and preserve the grouping of the heading with its supporting copy.

<h3> element

Baseline and scoped. Give all six heading levels readable defaults. Set size and rhythm within the composition when needed. Keep heading rank in HTML and preserve the grouping of the heading with its supporting copy.

<h4> element

Baseline and scoped. Give all six heading levels readable defaults. Set size and rhythm within the composition when needed. Keep heading rank in HTML and preserve the grouping of the heading with its supporting copy.

<h5> element

Baseline and scoped. Give all six heading levels readable defaults. Set size and rhythm within the composition when needed. Keep heading rank in HTML and preserve the grouping of the heading with its supporting copy.

<h6> element

Baseline and scoped. Give all six heading levels readable defaults. Set size and rhythm within the composition when needed. Keep heading rank in HTML and preserve the grouping of the heading with its supporting copy.

<hgroup> element

Baseline and scoped. Give all six heading levels readable defaults. Set size and rhythm within the composition when needed. Keep heading rank in HTML and preserve the grouping of the heading with its supporting copy.

<math> element

Scoped and browser. Size and color decorative icons inside an icon scope. Preserve illustration fills, accessible labels, and MathML layout. Avoid global icon resets on all SVGs.

<svg> element

Scoped and browser. Size and color decorative icons inside an icon scope. Preserve illustration fills, accessible labels, and MathML layout. Avoid global icon resets on all SVGs.

<meter> element

Baseline and scoped. Style a bounded measure, task progress, or calculation result according to its native purpose. Keep determinate and indeterminate progress distinct and expose important values in text.

<output> element

Baseline and scoped. Style a bounded measure, task progress, or calculation result according to its native purpose. Keep determinate and indeterminate progress distinct and expose important values in text.

<progress> element

Baseline and scoped. Style a bounded measure, task progress, or calculation result according to its native purpose. Keep determinate and indeterminate progress distinct and expose important values in text.

role="status" element

Announce completed, non-urgent updates in a polite status region.

<noscript> element

Browser. A template's content is styled when instantiated. Style slotted content at the documented shadow boundary when integrating with a consumer's shadow DOM. Ordinary Thin-Sky markup lives in the document. Content that renders inside noscript receives the same HTML defaults as the rest of the page.

<slot> element

Browser. A template's content is styled when instantiated. Style slotted content at the documented shadow boundary when integrating with a consumer's shadow DOM. Ordinary Thin-Sky markup lives in the document. Content that renders inside noscript receives the same HTML defaults as the rest of the page.

<template> element

Browser. A template's content is styled when instantiated. Style slotted content at the documented shadow boundary when integrating with a consumer's shadow DOM. Ordinary Thin-Sky markup lives in the document. Content that renders inside noscript receives the same HTML defaults as the rest of the page.

Date and time input guidance componentPreview

Compose native date and time controls with an explicit time-zone value and server-owned calendar rules.

Default input and text, email, password, search, tel, url input

Share a direct control skin. Keep password manager, autofill, autocomplete, input mode, and search affordances intact. A placeholder is a hint and still needs a label.

button, submit, reset, image input types and button elements input

Preserve the real action type and form owner. A skin may change their appearance. Image submit controls require a useful text alternative.

checkbox, radio input

Keep the native input and its real label. Use accent-color when sufficient. A switch presentation still needs an actual on/off control, checked state, and keyboard access.

date, datetime-local, month, time, week input

Style the outer control. Keep localized formatting and the browser picker available. Provide visible instructions and server validation when formats or support vary.

hidden input

Keep it out of the rendered UI and preserve its form value.

number input

Style the field and keep native step, min/max, typing, and stepper behavior.

range, color, file input

Keep the native affordance and picker. Prefer accent-color for range and a scoped ::file-selector-button treatment where supported. Any custom track or swatch treatment needs focus, keyboard, and forced-color checks.

select, option, optgroup, datalist, selectedcontent input

Style the authored select and let the browser own option selection and suggestion UI. Preserve native multiple and listbox modes. The customizable native select proposal is Lab-only. Gate appearance: base-select and ::picker(select) behind feature detection and keep selectedcontent within that experiment. The searchable-select recipe remains the server-authoritative filtering and multiple-value model. Customizable select

textarea input

Reuse the field typography and focus treatment. Keep resize and multiline scrolling available. Treat CSS field sizing as an optional enhancement.