// Real-brand LLM logo marks (SVG)
// Used to identify the AI search engines in the live monitor + analytics.
const ChatGPTMark = ({ size = 18, mono = false }) => (
);
// Anthropic / Claude mark — stylized starburst in their coral
const ClaudeMark = ({ size = 18, mono = false }) => {
const color = mono ? "currentColor" : "#CC785C";
// 7 thin parallelogram bars meeting at center — approximation of the Anthropic mark
const bars = [];
for (let i = 0; i < 7; i++) {
const angle = (i * 180) / 7;
bars.push(
);
}
return (
);
};
// Google Gemini — 4-pointed star tuned to the site palette
const GeminiMark = ({ size = 18, mono = false }) => {
const gid = "gem-" + Math.random().toString(36).slice(2, 7);
return (
);
};
// Perplexity — stylized rounded knot mark in their teal
const PerplexityMark = ({ size = 18, mono = false }) => {
const color = mono ? "currentColor" : "#20B8CD";
return (
);
};
// Google search (for completeness)
const GoogleMark = ({ size = 18 }) => (
);
// ---------------------------------------------------------------
// Tech-stack vendor marks
// ---------------------------------------------------------------
// Google Analytics — stylized GA bar mark
const GoogleAnalyticsMark = ({ size = 18 }) => (
);
// SEMrush — orange S
const SEMrushMark = ({ size = 18 }) => (
);
// Ahrefs — warm A mark
const AhrefsMark = ({ size = 18, mono = false }) => (
);
// HubSpot — orange sprocket
const HubSpotMark = ({ size = 18 }) => (
);
// Zapier — orange spark
const ZapierMark = ({ size = 18 }) => {
const c = "#FF4F00";
return (
);
};
// n8n — pink dot-network
const N8nMark = ({ size = 18 }) => {
const c = "#EA4B71";
return (
);
};
// Meta — gradient infinity tuned to the site palette
const MetaMark = ({ size = 18 }) => {
const gid = "meta-" + Math.random().toString(36).slice(2, 7);
return (
);
};
// Google Search Console — warm magnifier
const GSCMark = ({ size = 18, mono = false }) => (
);
// BigQuery — warm cube
const BigQueryMark = ({ size = 18, mono = false }) => (
);
// Segment — green concentric arcs
const SegmentMark = ({ size = 18 }) => {
const c = "#52BD94";
return (
);
};
// Mixpanel — warm dot-circle
const MixpanelMark = ({ size = 18 }) => {
const c = "#FF3366";
return (
);
};
// Brave Search — orange lion-flame
const BraveMark = ({ size = 18 }) => {
const c = "#FB542B";
return (
);
};
// Replacement EngineGlyph that dispatches to the brand marks
const EngineMark = ({ engine, size = 18, mono = false }) => {
switch (engine) {
case "gpt":
case "chatgpt":
case "openai": return ;
case "perplexity": return ;
case "gemini":
case "google-gemini": return ;
case "claude":
case "anthropic": return ;
case "google": return ;
case "ga":
case "google-analytics": return ;
case "semrush": return ;
case "ahrefs": return ;
case "hubspot": return ;
case "zapier": return ;
case "n8n": return ;
case "meta":
case "meta-ads": return ;
case "gsc":
case "google-search-console": return ;
case "bigquery": return ;
case "segment": return ;
case "mixpanel": return ;
case "brave":
case "brave-search": return ;
default: return null;
}
};
Object.assign(window, {
ChatGPTMark, ClaudeMark, GeminiMark, PerplexityMark, GoogleMark,
GoogleAnalyticsMark, SEMrushMark, AhrefsMark, HubSpotMark,
ZapierMark, N8nMark, MetaMark, GSCMark,
BigQueryMark, SegmentMark, MixpanelMark, BraveMark,
EngineMark,
});