Make Every Website
AI-Ready

Add an "Explore With AI" button to any site with one script tag. Visitors can open your page in ChatGPT, Claude, Gemini, and more.

<script src="https://cdn.jsdelivr.net/gh/markwinters/explorewithai-widget@main/dist/explore-ai.min.js"></script>
⚡ 20 KB 🛡️ Shadow DOM 🌓 Dark / Light ♿ Accessible 📦 Zero deps

Live Preview

Toggle theme, position, and label to see the widget update in real time.

Widget appears in this preview area

Installation

Add the script tag anywhere on your page. That's it.

<script src="https://cdn.jsdelivr.net/gh/markwinters/explorewithai-widget@main/dist/explore-ai.min.js" ></script>

Configuration

Use data-* attributes on the script tag for customization.

<script src="https://cdn.jsdelivr.net/gh/markwinters/explorewithai-widget@main/dist/explore-ai.min.js"
  data-theme="dark"
  data-position="bottom-left"
  data-label="Ask AI"
  data-providers="chatgpt,claude,gemini"
  data-compact
></script>
Attribute Values Default Description
data-theme light, dark, auto auto Color scheme
data-position bottom-right, bottom-left, top-right, top-left bottom-right Button position on page
data-label Any string Explore With AI Button text
data-providers Comma-separated IDs All Visible providers
data-compact true or omitted Icon-only circular button. Auto-enabled on mobile.

Providers

ChatGPT
Claude
Gemini
Perplexity
Copilot
Grok
DeepSeek
Meta AI
Mistral

JavaScript API

For advanced use cases — SPAs, dynamic config, or programmatic control.

// Initialize with custom config
window.ExploreAI.init({ theme: 'dark', label: 'Ask AI' });

// Destroy the widget
window.ExploreAI.destroy();

// Refresh page data (SPA navigation)
window.ExploreAI.refresh();