Home / Technologies / JavaScript Frameworks / Alpine.js

Frameworks

Alpine.js in Homepage Source

Alpine.js is a small framework for adding reactive behaviour directly in HTML markup.

The source-code fingerprint

Alpine components are declared with an x-data="..." attribute on an element.

Likely false positives: x-data is Alpine-specific; very reliable.

Stored source examples for Alpine.js

These examples matched x-data= in stored homepage source when the query was sampled on 2026-10-14. The sites may have changed since the source was captured. A match establishes a source reference; it does not confirm an active installation or code execution.

• lifehacker.com ...o flex max-w-8xl flex-col px-4" data-ga-module="header-nav" x-data="{ navOpen: false }">\n <div class=" py-8 md:py-10">\n ...
• mashable.com ...y:none;visibility:hidden"></iframe></noscript>\n <nav x-data="{navOpen: false}" class="top-0 z-30 py-3 w-full bg-white bo...
• data.world ... <div>\n \n\n \n \n \n <div x-data="alert_bar('servicenow_ddw_sunset')"\n class="...
• www.spreaker.com ...00 dark:bg-neutral-950"\n :class="dark ? 'dark' : ''"\n x-data="{\n dark: $persist(true).as('sp_storage.theme.dark'),...
• www.nielsen.com ...l-10{margin-left:3rem!important;}<br />\n</style></p>\n\n\n<nav x-data="navSearch" x-init="setSiteURL(&quot;https://www.nielsen.com...
• www.pcmag.com ...p w-full bg-white drop-shadow-[0_1px_5px_rgba(0,0,0,0.25)]" x-data="{ open: false }">\n <div class="relative mx-auto flex...
• rhymesayers.com ...p {\n display: none;\n }</style></noscript> <body x-data="{ artistFilter: 'current' }" class="index"\n data-mon...
• plausible.io ...></head> <body class="flex flex-col h-full bg-gray-50"><nav x-data="{mobileNav: false}" class="relative py-8 z-10"> <div class=...
• denshi.vn ...[&quot;cart-updated&quot;]}" wire:id="ei3nA2phmqGFzgXvv10A" x-data="{ mobileMenuOpen: false }">\n <header class="sticky top-0...
• docs.docker.com ...blue-800 focus:ring focus:ring-blue-400 focus:outline-none" x-data="{ theme: localStorage.getItem('theme-preference') || 'auto'...
• ghost.org ...tive bg-[var(--header-bg)]" data-header-transparent="false" x-data="{open: false}" x-on:keydown.escape="open = false"><div clas...
• www.datadoghq.com ...product/>Product</a><div class="dropdown-menu product-menu" x-data="{\n openCategory: 'observability',\n ...
• www.vidyard.com ...color:rgba(255,255,255,.45)!important; }\n</style>\n\n<header\n\tx-data="{\n\t\tmobileOpen:false,\n\t\tscrolled:window.scrollY > 0,\n\t\tisLg...
• www.bundestag.de ..." title="Tagesordnungen der Ausschüsse"/></head>\n\n\n\n<body x-data="{ &quot;currentPage&quot;: 441486 }">\n<nav class="sr-menu">...
• www.coingecko.com ... </div>\n\n</div>\n <div class="tw-flex tw-flex-col" x-data="{ navbar_gas: false }" @mouseover.away="navbar_gas = false"...
• www.insidehighered.com .../li>\n <li class="toggleable flex items-center" x-data="{ showDesktopMenu: false }">\n <div class="mega-menu"...
• iabeurope.eu ...37-10" class="oxy-site-navigation custom-header__mob-nav " x-data="oxyA11yMenuData" aria-label="Main">\n <!-- Default st...
• www.health.harvard.edu ...nt</a>\n\n \n <header\n id="global-header"\n x-data="{\n headerSticky: false,\n mobileMenuOpen: fals...
• www.rtve.es ...0" data-mix-generated-at="2026-09-05T00:41:16+02:00" data-mix-data="eyJwaW5nIjp7ImFuY2hvcl90eXBlIjoiTUlYIiwiYW5jaG9yX2lkIjoiNDE...
• www.ala.org ...<header role="banner" class="w-full border-b z-20 relative" x-data="{ open: false }">\n\n \n <div class="hidden xl:blo...
• a16z.com <!DOCTYPE html>\n<html x-data="layoutVars()" lang="en" class=" h-full" data-mode-container...
• www.awin.com <!DOCTYPE html><html lang="en" x-data="html"> <head><meta charset="utf-8"><script id="usercentrics...
• www.mailerlite.com ...raffic-41633c23.js"></script>\n</head>\n<body\n x-cloak\n x-data="{\n isOpen: false,\n isModalOpen: false\n }"\n :cla...
• www.t-mobile.com ... <nav class="unav-hero-nav unav-hero-nav--hero-overlay" x-data="heroNav()" data-unav-component="hero-nav" aria-label="Prima...
• www.thetradedesk.com ...e":"checkboxGroup"}]\n </script>\n <div\n x-data="{\n navBackground: '',\n headerTheme: '...
• gohugo.io ...col min-h-full bg-white dark:bg-blue-950 kind-home"><header x-data=navbar class="[view-transition-name:site-header] print:hidde...
• www.extremetech.com .../p?c1=2&c2=6036202&cv=2.0&cj=1" /></noscript>\n\n <nav x-data="{navOpen: false}" class="bg-brand-slate w-full border-b-4 b...
• www.adroll.com ...iv class="nav">\n\n <div id="nav-items" class="nav__bar" x-data="{ mobileOpen: false }">\n\n <div class="nav__branding"...
• bigthink.com ...bsolute print:hidden z-[100]" :class="nav_open && 'h-full'" x-data="{nav_open: false, search_open: false}">\n ...
• builtin.com ... <div class="d-flex gap-md gap-xl-xl"><div class="search" x-data="headerSearch()"><button id="header-search-dropdown" type="b...

Showing 30 checked source examples. The headline is estimated matches. Open the full ranked list, inspect the matched source, and export the domain list →

Related technologies

How this works

The headline distinguishes candidate upper bounds (index prefilter), estimated matches (a projection from checked samples) and verified matches (an exact count established by the engine). The index contains 131,219,565 homepage documents, one homepage per hostname, including subdomains. The source index was promoted 2026-09-22 and follows a quarterly rebuild schedule. The sample date is when this query was checked against the stored index, not a new crawl of each example site.

Comparing adoption across tools? The Web Technology Adoption Report ranks the most common tags in the index side by side.