Feather detector

Feather logo

How can you detect if a website uses Feather?

Detecting whether a website uses Feather involves examining specific indicators in the page source and network activity.

Here’s a step-by-step guide on how to do it:

  1. Open the Page Source: Right-click on the webpage and select “View Page Source” or press Ctrl+U (Windows) or Cmd+Option+U (Mac) to open the page’s source code.
  2. Search for Feather Indicators in the Page Source: Use Ctrl+F (Windows) or Cmd+F (Mac) to open the search function and look for the keyword feather. You may find it in various contexts:
    • Look for <script src="https://unpkg.com/feather-icons/dist/feather.min.js"></script>: This script tag is commonly included to import the Feather icons library.
    • Check for any references like data-feather in HTML elements. This attribute is often used to apply Feather icons to specific elements.
  3. Check for CSS Styles: Search for CSS styles associated with Feather icons. Look for styles that may include classes related to Feather. For example:
    • .feather: This class is often added to SVG icons when using Feather.
  4. Look for Inline SVGs with Feather: Feather uses SVG elements for rendering icons. Inspect elements on the webpage using the developer tools (right-click on an element and select “Inspect”) and check for any inline SVG code with references to Feather.
  5. Search for Feather Icon Loader: In some cases, websites may load Feather icons dynamically. Look for JavaScript code that initializes Feather icons, such as: feather.replace(); This function call will be present in scripts to replace elements with Feather icons.
  6. Check for Network Requests: Use the Network tab in the developer tools to monitor any incoming requests for Feather files or associated SVGs. Look for requests for scripts or styles from unpkg.com or similar sources.

Learn more about Feather with these articles