<div className="not-markdown my-6 flex gap-gutter rounded-sm border border-marketing-divider p-5 max-sm:flex-col sm:items-center sm:justify-between sm:rounded-lg">
  <div className="flex items-center justify-start gap-5">
    <div className="max-w-sm text-sm/snug text-balance">
      <h3 className="font-medium text-marketing">Book a demo to get started</h3>
      <p className="mt-0.5 text-marketing-subtler">
        We’ll walk you through how AI Copilots work, explore your use case, and
        tailor the onboarding to your product.
      </p>
    </div>
  </div>
  <ButtonLink appearance="primary" href="/contact/sales">
    Book a demo
  </ButtonLink>
</div>

Four years ago, we started Liveblocks with a belief: the best products aren’t
built for solo users—they’re built for collaboration.

I saw this firsthand at InVision. The company went from leading the design
tooling space in 2018 to losing it all—beaten by Figma, which was browser-based
and collaborative by default. In just a few years, InVision went from over $100M
in ARR to dead. Figma didn’t win because it had more design features. It won
because it felt alive—like a space where the entire organization could create
together, not just designers.

That experience shaped how we built Liveblocks. In
[chapter 1](/blog/liveblocks-collaborative-experiences-in-days-not-months), we
gave developers the foundational building blocks to bring multiplayer
collaboration to their own apps. In
[chapter 2](/blog/introducing-liveblocks-2-0), we made it even easier by
shipping ready-made components—like comments, notifications, and collaborative
text editors.

Today, we’re entering chapter 3: giving every company the tools to make AI a
real collaborator inside their product. We’re building the interface layer for
human and AI collaboration—so any company can make their product AI-native
through a beautifully crafted interface where people and AI collaborate and get
more done together.

If you’re looking to future-proof your product and give your users a faster,
more collaborative way to work with AI—Liveblocks is how you do it.

<YouTube id="PdFEejTuKh4" />

## AI Copilots is now available

After months in private beta, we’re opening up access to
[AI Copilots](/ai-copilots)—a new way to embed collaborative AI assistants
inside your product.

With just a few lines of code, you can add an AI copilot that’s fully
integrated, deeply customizable, and context-aware. These aren’t generic
chatbots—they’re in-app collaborators that understand your product, assist your
users in context, and even take action on their behalf.

Early access customers are already building copilots for onboarding, customer
support, and internal productivity—giving their users faster, more collaborative
ways to get things done.

<div className="not-markdown my-6 flex gap-gutter rounded-sm border border-marketing-divider p-5 max-sm:flex-col sm:items-center sm:justify-between sm:rounded-lg">
  <div className="flex items-center justify-start gap-5">
    <div className="max-w-sm text-sm/snug text-balance">
      <h3 className="font-medium text-marketing">Book a demo to get started</h3>
      <p className="mt-0.5 text-marketing-subtler">
        We’ll walk you through how AI Copilots work, explore your use case, and
        tailor the onboarding to your product.
      </p>
    </div>
  </div>
  <ButtonLink appearance="primary" href="/contact/sales">
    Book a demo
  </ButtonLink>
</div>

## What makes AI Copilots different

AI Copilots are fully integrated collaborators inside your product—able to
understand context, take action, and get things done alongside users. An AI
copilot is more than just a chatbot—it can power a wide range of use cases,
including:

- **In-app support copilots**: where the AI doesn’t just explain what to do, it
  takes action for the user—completing tasks directly in your product.
- **Onboarding copilots**: that guide new users step-by-step, with full context.
- **Collaborative writing copilots**: that review, edit, and comment like a
  teammate inside your editor.
- **Analytics copilots**: that answer questions, pull data, and guide users
  through dashboards.

<Slideshow
  timingBetweenSlides={3000}
  slides={[
    {
      width: 656,
      height: 437,
      imageUrl: "/images/blog/liveblocks-3-0/in-app-support-copilots.jpg",
      caption: "AI can take actions for the user.",
    },
    {
      width: 656,
      height: 437,
      imageUrl:
        "/images/blog/liveblocks-3-0/collaborative-writing-copilots.jpg",
      caption: "Your in editor co-author.",
    },
    {
      width: 656,
      height: 437,
      imageUrl: "/images/blog/liveblocks-3-0/onboarding-copilots.jpg",
      caption: "Helps users get started, right from the chat.",
    },
    {
      width: 656,
      height: 437,
      imageUrl: "/images/blog/liveblocks-3-0/analytics-copilots.jpg",
      caption: "Make your data conversational.",
    },
    {
      width: 656,
      height: 437,
      imageUrl:
        "/images/blog/liveblocks-3-0/ai-copilot-editor-smart-suggestions.jpg",
      caption: "Start writing together.",
    },
  ]}
/>

## What your users get

When your users have access to an AI copilot that’s embedded in their workflow,
here’s what they gain:

- **Real help, in context**: AI Copilots live inside your product, not on the
  sidelines. They understand what the user is doing and can assist directly—from
  answering questions to completing tasks.
- **Faster onboarding**: New users don’t need to dig through docs. They can ask
  questions naturally and get personalized, in-app guidance.
- **Fewer blockers, more progress**: Copilots can perform actions, make changes,
  or help users write, edit, or review content collaboratively—so your users
  move faster and stay in flow.
- **Connected to your source of truth**: Copilots reference your product’s
  documentation, help center, or internal knowledge base to give accurate,
  domain-specific answers your users can trust.
- **Collaborative by design**: Copilots work work seamlessly in collaborative
  settings where multiple users and AI share the same canvas, editor, or flow.

<Figure>
  <video autoPlay loop muted playsInline>
    <source
      src="/images/blog/liveblocks-3-0/many-features.mp4"
      type="video/mp4"
    />
  </video>
</Figure>

## What your business gets

When your product gets smarter and more collaborative, your business benefits
too:

- **Higher engagement and retention**: When users feel supported and can move
  faster, they stick around—and actually adopt more of your product.
- **Revenue expansion**: These AI and collaboration features can be offered as
  part of a premium plan or usage-based tier, unlocking new monetization paths.
- **Faster activation**: With copilots guiding new users from day one, you
  shorten time to value and improve conversions.
- **A differentiated AI experience**: You’re not just “adding AI”—you’re giving
  users a smarter, more collaborative way to work inside your product.
- **Increased developer velocity**: You don’t have to build AI UX, context
  pipelines, memory, or action handling from scratch. It’s all included.

<BlogPostQuote
  quote="As a designer who codes, Liveblocks let me turn an idea into a fully launchable feature in just weeks—without pulling in engineering. They handle the hard parts of AI development, so I can focus on what matters most: the user experience."
  author={{
    name: "Ryan Visek",
    title: "Product Designer at ReadMe",
    avatarUrl: "/images/people/ryan-visek.jpg",
    companyAvatarUrl: "/images/companies/avatars/readme.png",
    companyName: "ReadMe",
  }}
/>

<div className="not-markdown my-6 flex gap-gutter rounded-sm border border-marketing-divider p-5 max-sm:flex-col sm:items-center sm:justify-between sm:rounded-lg">
  <div className="flex items-center justify-start gap-5">
    <div className="max-w-sm text-sm/snug text-balance">
      <h3 className="font-medium text-marketing">Book a demo to get started</h3>
      <p className="mt-0.5 text-marketing-subtler">
        We’ll walk you through how AI Copilots work, explore your use case, and
        tailor the onboarding to your product.
      </p>
    </div>
  </div>
  <ButtonLink appearance="primary" href="/contact/sales">
    Book a demo
  </ButtonLink>
</div>

## What your developers get

And for your developers, it’s a dream to implement:

- **No need to reinvent the stack**: We handle realtime sync, context wiring,
  action handling, and collaborative state—so your team can focus on what
  matters.
- **World-class developer experience**: Clear docs, flexible APIs, live
  examples, and support that actually helps. Your team will be shipping fast,
  not stuck in integration hell.
- **Works with any existing app**: No need to rewrite your app to use AI
  Copilots.
- **Pre-built components**: React components for chat, toolbars, and
  actions—fully customizable to match your product.
- **Works with any AI model**: OpenAI, Claude, Gemini, or your own. You choose
  the brain; we handle the body. More models coming soon.

<Figure>
  <video autoPlay loop muted playsInline>
    <source
      src="/images/blog/liveblocks-3-0/invite-member.mp4"
      type="video/mp4"
    />
  </video>
</Figure>

```tsx title="Create a new chat"
<AiChat chatId="my-new-chat" />
```

```tsx title="Add an “invite member” tool"
<RegisterAiTool
  name="invite-member"
  tool={defineAiTool()({
    description: "Invite a new member to the team",
    parameters: {
      type: "object",
      properties: { email: { type: "string" } },
    },
    render: ({ args }) => {
      return (
        <AiTool title="Invite member">
          <AiTool.Confirmation confirm={() => inviteMember(args.email)}>
            Invite <code>{args.email}</code> to the team?
          </AiTool.Confirmation>
        </AiTool>
      );
    },
  })}
/>
```

This is just the beginning.

Today marks a major step forward in our mission to power the next generation of
software—products where people and AI collaborate seamlessly, in realtime,
inside the tools we use every day. If you’re interested in learning more about
how we built AI Copilots, we’ll be hosting an online event on July 2nd.

<div className="not-markdown my-6 flex gap-gutter rounded-sm border border-marketing-divider p-5 max-sm:flex-col sm:items-center sm:justify-between sm:rounded-lg">
  <div className="flex items-center justify-start gap-5">
    <Image
      className="h-auto max-w-20 rounded-xs sm:rounded"
      src="/images/blog/liveblocks-3-0/luma.png"
      alt="Liveblocks behind the scenes online event"
      width={80}
      height={80}
      quality={95}
    />
    <div className="max-w-sm text-sm/snug text-balance">
      <h3 className="font-medium text-marketing">Online event</h3>
      <p className="mt-0.5 text-marketing-subtler">
        On July 2, we’re hosting a live behind-the-scenes event to show how we
        built AI Copilots, and what’s next.
      </p>
    </div>
  </div>
  <ButtonLink appearance="primary" href="https://lblcks.io/ai-event">
    Register
  </ButtonLink>
</div>

On behalf of the entire Liveblocks team, thank you to our customers, community,
and investors for believing in this vision and helping us bring it to life.