The link-parameters CSS property, param() modifier for the url() CSS function, and the #:~:param(…) URL fragment set custom CSS environment variables on an external resource, such as an SVG image, allowing the external resource to adapt its presentation based on the variables.
Web platform features
The Temporal API allows you to work with dates, times, time zones, and durations. It is more powerful than the Date API.
The interpolate-size CSS property sets whether animations and transitions interpolate between a numeric value and a keyword value, such as from a fixed length to auto or fit-content.
The corner-shape CSS property sets the shape of an element's corners when using border-radius, allowing for shapes other than rounded corners. For example, corner-shape: squircle is a shape in between a square and rounded corner.
#5
The Web MIDI API enables selecting MIDI input and output devices and sending and receiving MIDI messages.
#6
The EditContext API allows you to build rich text editors that support advanced text input, such as Input Method Editor (IME) composition, an emoji picker, or other platform-specific editing UI.
The navigator.gpu API performs operations such as rendering and computation on dedicated graphics hardware (also known as a Graphics Processing Unit).
The using and await using declarations and the dispose and asyncDispose symbols manage the lifecycle of resources such as file handles and streams. The DisposableStack and AsyncDisposableStack objects can group, dispose, and coordinate dependencies between multiple disposable resources.
The blocking="render" attribute for <link>, <script>, and <style> elements blocks rendering until the external script or stylesheet has been loaded. For <link rel="expect">, rendering is blocked until a specific element is in the DOM.
The <select> element's appearance, including the button, selected option, picker dropdown, and options, can be customized using CSS.
The gamepad.vibrationActuator property represents a gamepad's haptics hardware, which allows you to control the vibration motors in a gamepad.
The Profiler API records data about the execution of a page, which you can send to a server for later analysis. Also known as self-profiling.
Anchor positioning places an element based on the position of another element. For example, you can place a tooltip next to the content it references.
The Sanitizer API customizes the sanitization of HTML parsed and inserted into the DOM in a way that can prevent cross-site scripting attacks. You can use it with DOM APIs that accept a sanitizer option, such as parseHTML() or setHTML().
#15
The JPEG XL image format is a raster graphics file format that supports animation, alpha transparency, and lossy as well as lossless compression.
The frame-sizing CSS property sets the size of an <iframe> element to that of it contents, to avoid scrolling in the iframe. Embedded documents allow this with the <meta name="responsive-embedded-sizing"> element and request resizing in the embedding page by calling window.requestResize().
The column-rule and row-rule CSS properties display decorative lines between columns and rows of a flex, grid, or multi-column layout. The rule-break, rule-outset, and rule-paint-order properties control the appearance of these lines.
The border-shape CSS property sets the geometry of the border box, changing the shape of any applicable border, border image, focus outline, or shadow.
The <input type="color"> HTML element shows a color picker from which users can choose a color value.
The @function CSS at-rule defines a custom function that takes CSS values or custom properties as arguments, and returns a CSS value. It can be based on conditional logic such as by using the @media at-rule.
#21
The Translator API translates some text from one natural language to another, using machine translation.
Interest invokers, registered by the interestfor HTML attribute, trigger events and actions on a target element when a user shows interest in the element, through behaviors such as hover, focus, or long-press. Pseudo-elements apply styles to sources and targets of interest.
The popover="hint" global HTML attribute creates a popover that is subordinate to popovers with a popover="auto" attribute. You can use this to create tooltips that don't dismiss auto popovers.
The display: grid-lanes and display: inline-grid-lanes CSS declarations create a layout where items are tightly packed in parallel lanes. Items are placed one by one in the lane that has the most available space. Also known as masonry.
