2027 Web Platform Feature Ranking

Ranked proposals (top = most important)

1. CSS if() function

   An inline conditional value that returns a value based on a set of conditions.
2. CSS grid lanes (masonry)

   display: grid-⁠lanes creates a layout where items are tightly packed into parallel lanes.
3. CSS margin-⁠trim

   Removes the margins of child elements when they meet the edges of the container.
4. CSS flex-⁠wrap: balance

   Distributes items in a multi-line flex container so each line has about the same number of items.
5. JavaScript Temporal

   A modern and extensive date/time API to replace Date.
6. CSS object-⁠view-⁠box property

   Crops and zooms to an inset area of an image.
7. CSS justify-⁠items and justify-⁠self in block layout
8. LayoutShift entries in the Performance API

   Measures the layout stability of web pages based on movements of the elements on the page. Used to calculate cumulative layout shift (CLS).
9. CSS line-⁠clamp property

   Limits the text in a block container to a certain number of lines. Also allows custom end text if content overflow occurs.
10. Customizable/stylable <select>

    Customize the button, selected option, picker, and options with CSS.
11. CSS align-⁠content for centering in buttons and inputs

    Allows overriding the vertical alignment of text in form controls.
12. CSS border-⁠shape property

    Sets the geometry of the border box to a fully custom shape, changing the shape of borders, outlines, and shadows.
13. CSS corner-⁠shape property

    Alternative shapes for border-⁠radius, such as squircles and bevels.
14. Allow CSS transitioning/animating display and content-⁠visibility

    Useful for delaying display: none until an exit animation completes.
15. Sanitizer API, via document.parseHTML() and element.setHTML()

    Customizes the sanitization of HTML inserted into the DOM, to prevent cross-site scripting attacks.