How can you detect if a website uses Radix?
Detecting whether a website uses Radix involves looking for specific markers in the page source and other elements of the site. Follow these steps to identify Radix usage:
- Open the Page Source: Right-click on the webpage and select “View Page Source” or press
Ctrl+U
(Windows) orCmd+Option+U
(Mac) to open the page source code. - Search for Radix-Specific Code: Once in the page source, use
Ctrl+F
(Windows) orCmd+F
(Mac) to open the search function and look for the following keywords:radix-ui
: This keyword indicates the presence of Radix components. You might see something like<script src="https://unpkg.com/@radix-ui/react-"></script>
- Check for Radix-Specific Attributes: Radix often uses specific attributes within HTML tags. Look for attributes such as
data-radix-ui
which are common in Radix controlled elements. - Inspect JavaScript Files: Sometimes, Radix might be included in external JavaScript files. Check the list of
<script>
tags in the page source and see if any scripts are pointing to Radix URLs such ashttps://cdn.jsdelivr.net/npm/@radix-ui/react-
. - Look for Component Class Names: Radix components often have distinctive class names. Consider using the browser’s Developer Tools (F12) and inspecting elements for class names such as
radix-
. - Examine the CSS Files: Look for any CSS files that might include styles specifically for Radix components. You can search for names or patterns like
radix
in linked CSS files. - Search for Radix Documentation URLs: Some websites might reference Radix in their comments or documentation links. Check the source code for any comments that mention Radix documentation or GitHub links.