 Annyeonghaseyo, I'm Jessalyn. Let's dive into what's new in DevTools in Chrome 90. Woohoo! DevTools now has dedicated CSS Flexbox debugging tools. When an HTML element on your page has displayed flex or displayed in live flex applied to it, you can see a flex badge next to it in the Elements panel. Click the badge to toggle the display of a flex overlay on the page. In the Styles pane, you can click on the new icon next to the display flex or display in live flex to open the Flexbox Editor. The Flexbox Editor provides a quick way to edit the Flexbox properties. Try it yourself. In addition, the Layout pane has a Flexbox section displaying all the Flexbox Elements on the page. You can toggle the overlay of each element. Next, you can now better visualize and measure your page performance with the new Core Web Witals overlay. Core Web Witals is an initiative by Google to provide unified guidance for quality signals that are essential to delivering a great user experience on the web. Go to web.dev.witals to learn more about it. Open the Command menu, run the Show Rendering command and then enable the Core Web Witals checkbox. The overlay currently displays three metrics. Largest Contentful Pane, LCP, Measure Loading Performance. First input delay, FID measures interactivity and cumulative layout shift, CLS measures visual stability. To dive into each of these metrics, go to the links provided in the video description. DevTools now has a new Issues Count button on the console status bar. This button replaced the Issues message in the console. Open the console, click on the Issues Count button to open the Issues tab. DevTools now displays all available trust tokens of the current browsing context in the new trust tokens pane. Trust token is a new API to help combat fraud and distinguish bots from real humans without passive tracking. Go to web.dev.trust that tokens to learn more on how to get started. Open the Applications panel. In the Storage side menu, select the Trust tokens pane. Here, you can view the stored token count of each trust token's issuer. The Color Gamut Media Query lets you test the approximate range of colors that are supported by the browser and the output device. For example, if the Color Gamut P3 Media Query matches, it means that the user's device supports the Display P3 color space. Open the Command menu. Run the Show Rendering command. Select an option from the Emulate CSS Media Feature Color Gamut dropdown. Next, a couple of improvements on Progressive Web Apps Tooling. Open the console. DevTools now displays a more detailed PWA installability warning message. It provides a link to the documentation helping you solve the issue. Go to the Application panel. Select the Manifest pane. DevTools now displays a warning message if the Manifest description assists 324 characters. The Manifest pane also shows a warning message if the screenshot of the PWA doesn't match the requirements. Learn more about the PWA Skin Shorts property at web.dev.add-manifest. Here is a bonus tip. You can change the color palette's preview of the color picker to preview the CSS wearables color instead. Say you have defined a list of custom CSS wearables. Open the color picker. By default, the color palette show a list of page colors. Next, expand the color palette section. Here, we can change the preview to material, custom, or the CSS wearables. Click on the CSS wearables. The color palette now changed to display all the colors we defined in the CSS wearables. Try to edit the color now. The color value is updated with the CSS wearable instead of the color code. Nice. Alright, there are more new features in Chrome DevTools 90. As usual, go to the video description for the link to my blog posts and others information. Thanks for watching. See you in 6 weeks for Chrome 91.