Package Exports
- notpixel
- notpixel/browser
- notpixel/react
Readme
NotPixel
Contextual ads SDK for LLMs. Simple, provider-agnostic, privacy-first.
NotPixel injects relevant, non-intrusive sponsored content into LLM responses — designed for AI-native platforms, chatbots, and assistants.
✨ Features
- 🔌 Provider Agnostic — Works with OpenAI, Anthropic, Google, xAI, Mistral, and 200+ models via OpenRouter
- 🔒 Privacy-First — Client-side embeddings option ensures user queries never leave the device
- ⚡ Streaming Support — Native streaming with ads injected at the end of responses
- ⚛️ React Components — Ready-to-use React components with proper disclosure
- 🌐 Browser SDK — Lightweight tracking for click and conversion events
- 📊 Full Analytics — Track impressions, clicks, and conversions
📦 Installation
# npm
npm install notpixel
# pnpm
pnpm add notpixel
# yarn
yarn add notpixel
# bun
bun add notpixel🚀 Quick Start
Basic Usage
import Ads from "notpixel";
const ads = new Ads({
publisherId: "pub_10565",
model: "openai/gpt-5.2",
input: "Review this product brief and suggest relevant developer tools.",
});
const response = await ads.offer();
console.log(response.text);
// → Your LLM response with contextually relevant sponsored contentWith Streaming
import Ads from "notpixel";
const ads = new Ads({
publisherId: "pub_10565",
model: "openai/gpt-5.2",
input: "Explain an API migration plan for a growing SaaS platform.",
});
const stream = await ads.stream();
for await (const chunk of stream) {
process.stdout.write(chunk.text);
}Privacy-First by Default
import Ads from "notpixel";
const ads = new Ads({
publisherId: "pub_10565",
model: "openai/gpt-5.2",
input: "Analyze a private customer support message and suggest relevant tools.",
// privacy: true is already the default
});
const response = await ads.offer();⚛️ React Integration
import { NotPixelAd } from "notpixel/react";
function ChatResponse({ message }) {
return (
<div>
<p>{message.content}</p>
{message.ad && (
<NotPixelAd
ad={message.ad}
impressionId={message.impressionId}
theme="dark"
/>
)}
</div>
);
}🌐 Browser Tracking
For client-side click and conversion tracking:
<script type="module">
import { trackClick, trackConversion } from "https://unpkg.com/notpixel/dist/browser.mjs";
// Track ad clicks
document.querySelector('.ad-link').addEventListener('click', () => {
trackClick(impressionId);
});
// Track conversions
trackConversion(impressionId, {
type: 'signup',
value: 0, // optional: value in cents
});
</script>Or with npm:
import { trackClick, trackConversion } from "notpixel/browser";
// Track clicks
trackClick(impressionId);
// Track conversions
trackConversion(impressionId, { type: "purchase", value: 9900 });⚙️ Configuration
Constructor Options
| Option | Type | Required | Description |
|---|---|---|---|
publisherId |
string |
✅ | Your publisher ID from the NotPixel dashboard |
model |
string |
✅ | Model identifier (e.g., openai/gpt-5.2, anthropic/claude-3) |
input |
string |
✅ | User's query or prompt |
privacy |
boolean |
❌ | Enable client-side embeddings (default: true) |
minContextScore |
number |
❌ | Minimum relevance score for ads (0-1, default: 0.3) |
disclosure |
string |
❌ | Custom disclosure text (default: "Sponsored") |
Environment Variables
The SDK automatically detects API keys from your environment:
# OpenAI
OPENAI_API_KEY=sk-...
# Anthropic
ANTHROPIC_API_KEY=sk-ant-...
# Google
GOOGLE_API_KEY=...
# OpenRouter (for 200+ models)
OPENROUTER_API_KEY=sk-or-...📊 Response Structure
interface AdsResponse {
text: string; // Full response with ad injected
ad: {
headline: string; // Ad headline
body?: string; // Ad body text
ctaLabel: string; // Call-to-action button text
ctaUrl: string; // Destination URL
disclosure: string; // "Sponsored" disclosure
} | null;
impressionId: string; // Use for click/conversion tracking
model: string; // Model used
provider: string; // Provider used
}🔧 Supported Models
NotPixel works with any LLM provider. Here are some examples:
| Provider | Model Examples |
|---|---|
| OpenAI | openai/gpt-5.2, openai/gpt-5.2-mini, openai/gpt-3.5-turbo |
| Anthropic | anthropic/claude-opus-4.5, anthropic/claude-3-sonnet |
google/gemini-pro, google/gemini-1.5-flash |
|
| xAI | xai/grok-2 |
| Mistral | mistral/mistral-large, mistral/mixtral-8x7b |
| Meta | meta/llama-3-70b (via OpenRouter) |
| Cohere | cohere/command-r-plus (via OpenRouter) |
💡 Use OpenRouter for access to 200+ models with a single API key.
🔐 Privacy & Compliance
NotPixel is designed with privacy at its core:
- No PII collected — We don't store user emails, names, or identifiers
- Client-side embeddings — Enabled by default, so queries never leave the device unless you opt out with
privacy: false - Transparent disclosure — All ads are clearly marked as sponsored
- GDPR/CCPA ready — Built for compliance with major privacy regulations
📖 Documentation
For full documentation, examples, and API reference:
🤝 For Publishers
Want to monetize your AI platform?
- Sign up at notpixel.ai/publisher
- Get your Publisher ID
- Integrate the SDK
- Start earning
📄 License
MIT © NotPixel