CSS DNA is a Chrome add-on designed for inspecting CSS and extracting design tokens from any website. This tool allows users to click on elements to instantly copy clean CSS code, eliminating the need to sift through DevTools. It provides a comprehensive overview of a site's design system, including colors, fonts, and various styling attributes, ranked by usage frequency. Users can export their findings in multiple formats such as Tailwind, CSS variables, JSON, and Figma, enhancing productivity in design workflows.

Key features include an eyedropper tool with accessibility contrast checking, one-click extraction of design systems, and a CSS health audit that scores specificity and consistency. The overlay interface is user-friendly, ensuring it does not disrupt the browsing experience. CSS DNA is free to use with essential features, while a subscription unlocks advanced exports and audits, making it suitable for front-end developers and designers looking to streamline their design processes.