> ## Documentation Index > Fetch the complete documentation index at: https://docs.heygaia.io/llms.txt > Use this file to discover all available pages before exploring further. # Using GAIA in Slack > Bring GAIA into your Slack workspace for quick actions and team collaboration export const PlatformDemo = ({platform}) => { const ui = useMemo(() => { const cn = (...args) => args.filter(Boolean).join(" "); const SF_STACK = '-apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif'; const SLACK_STACK = '"Slack-Lato", "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'; const DISCORD_STACK = '"gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif'; const DEFAULT_AVATAR = "/images/demos/gaia-avatar.webp"; const AVATAR_ARYAN = "/images/demos/aryan-avatar.webp"; const PLATFORMS = { whatsapp: { phone: { screenBackground: "#F6F6F6" }, demo: { title: "GAIA", messages: [{ from: "me", text: "what's on my plate today?", time: "9:14", status: "read" }, { from: "them", text: "4 meetings back to back from 9.30, plus that investor draft you flagged yesterday", time: "9:14" }, { from: "them", text: "want me to push standup to 11 so you have a coffee window?", time: "9:14" }, { from: "me", text: "yes pls. also remind me to call mom at 8 πŸ™", time: "9:15", status: "read" }, { from: "them", text: "done & done 🫑", time: "9:15" }] } }, telegram: { phone: { screenBackground: "#F6F6F6" }, demo: { title: "GAIA", subtitle: "bot", messages: [{ from: "me", text: "summarise my inbox", time: "14:02", status: "read" }, { from: "them", text: "you've got 12 unread. 3 actually need you, the rest is noise", time: "14:03" }, { from: "them", text: "drafting replies to the linear founder + the recruiter rn", time: "14:03" }, { from: "me", text: "also book me to NYC next thursday", time: "14:04", status: "read" }, { from: "them", text: "looking… delta has $189 out at 8am, lands 11ish. lock it in?", time: "14:04" }] } }, slack: { phone: {}, demo: { title: "design", subtitle: "42 members", messages: [{ author: "Aryan", avatar: AVATAR_ARYAN, text: "@GAIA standup post for design? pull from yesterday's threads", time: "10:24 AM" }, { author: "GAIA", text: "pulled this from 4 open PRs and 6 figma comments since yesterday 🧡", time: "10:24 AM", reactions: [{ emoji: "πŸŽ‰", count: 4 }, { emoji: "πŸ”₯", count: 2 }] }, { author: "Aryan", avatar: AVATAR_ARYAN, text: "send it. also draft a reply to the PM thread in #product", time: "10:25 AM" }, { author: "GAIA", text: "on it. DMing you the draft in 30s", time: "10:26 AM" }] } }, discord: { phone: { screenBackground: "#1E1F22", statusBarTone: "light" }, demo: { title: "general", messages: [{ author: "Aryan", avatar: AVATAR_ARYAN, authorColor: "#F47FFF", text: "@GAIA ship digest for the week?", time: "9:14 PM", reactions: [{ emoji: "πŸ‘", count: 3 }] }, { author: "GAIA", authorColor: "#9CC3FF", text: "12 PRs merged, 4 features shipped, 2 incidents resolved πŸš€", time: "9:14 PM" }, { author: "Aryan", avatar: AVATAR_ARYAN, authorColor: "#F47FFF", text: "post it in #releases", time: "9:15 PM" }, { author: "GAIA", authorColor: "#9CC3FF", text: "posted, ping me if anyone has follow-ups", time: "9:15 PM" }] } } }; const isDarkColor = color => { if (!color) return false; const c = color.trim().toLowerCase(); if (c === "#000" || c === "#000000" || c === "black") return true; const hex = c.match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/); if (hex) { let h = hex[1]; if (h.length === 3) h = h.split("").map(ch => ch + ch).join(""); const r = Number.parseInt(h.slice(0, 2), 16); const g = Number.parseInt(h.slice(2, 4), 16); const b = Number.parseInt(h.slice(4, 6), 16); return (r * 299 + g * 587 + b * 114) / 1000 < 128; } const rgb = c.match(/rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/); if (rgb) { const r = Number.parseInt(rgb[1], 10); const g = Number.parseInt(rgb[2], 10); const b = Number.parseInt(rgb[3], 10); return (r * 299 + g * 587 + b * 114) / 1000 < 128; } return false; }; const SideButtons = () => <>