Top 6 Chrome DevTools Experiments You Should Start Using Today

A quick overview of fantastic Google Chrome Developer Tools experiments that will help you level up your DevTools productivity.

A quick overview of fantastic Google Chrome Developer Tools experiments that will help you level up your DevTools productivity.

Find out how can those features help you be more efficient when working with length values, font properties, and DevTools color picker. You’ll understand why some properties don’t work in a specific context better, and you’ll have a better accessibility overview.

Chapters

• 00:00 How to enable Google Chrome DevTools experiments
• 01:08 CSS length authoring
• 02:31 CSS authoring hints for inactive rules
• 03:41 New Font Editor in Styles Pane
• 04:22 Color picking outside the browser window
• 05:31 New advanced Perceptual Contrast Algorithm (APCA)
• 06:45 Source order viewer in the Accessibility Pane
• 08:19 Conclusion

Links

• CSS Staircase Hover Effect Using :has()
• In-Depth Guide to CSS Logical Properties
• In-Depth Guide to CSS Parent Selector :has()