Created v0 launch blog

contents/blog/posthog-v0-integration.md

@@ -0,0 +1,114 @@
+---
+title: "PostHog is now available in Vercel’s v0"
+date: 2026-02-12
+rootPage: /blog
+sidebar: Blog
+showTitle: true
+hideAnchor: true
+author:
+    - sara-miteva
+featuredImage: >-
+    https://res.cloudinary.com/dmukukwp6/image/upload/v0_cover_62a4b51598.png
+featuredImageType: full
+category: Product
+tags:
+    - Product
+seo:
+    {
+        metaTitle: 'PostHog is now available in Vercel’s v0',
+        metaDescription: 'Build with real product context in Vercel’s v0. Connect PostHog to design UI, experiments, and features based on actual user behavior.',
+    }
+---
+We've released a [brand new PostHog × Vercel integration](/blog/vercel-integration). That integration made the setup intentionally boring. Flags and experiments are defined in PostHog, synced into Vercel’s native Flags system, credentials are handled automatically, and your app simply consumes them via the Flags SDK.
+
+That integration focuses on how flags and experiments run in production. Now, we’re extending the same product context into [Vercel's v0 via MCP](https://v0.app/), so it’s available while you’re building.
+
+<WistiaEmbed mediaId="13hp4af5cc" />
+
+## What you can do with PostHog in v0
+
+v0 can build directly on real codebases, enabling teams to ship production-ready apps and agents rather than prototypes or toy projects.
+
+With PostHog as a partner, v0 doesn’t just generate code against your repository – it can do so with an understanding of how your product actually behaves in production. It has access to experiment results, user behavior patterns, feature flag state, and error impact, which means the software you generate reflects real product data rather than assumptions about how the product should work.
+
+There's so much you can do with PostHog in v0 that we asked our Growth team what types of prompts they'd start with.
+
+### Act based on experiment results
+
+When iterating on onboarding or activation flows, existing experiments often already contain the answer to “which direction should we take.” With PostHog connected, v0 can reference experiment data and use it as context when generating UI, so new designs reflect what has already been tested in production.
+
+**Suggested prompt:**
+
+> Based on the onboarding experiment testing long vs short signup, show me the metrics and then generate a signup flow aligned with the winning variant.
+
+**Insights from our Growth team:** You can use this when redesigning signup or pricing pages. For example, if a shorter signup form improved completion rate but reduced activation, that tells you friction wasn’t the only issue. You might keep the shorter form but strengthen the first-run experience, add clearer value framing, or tailor the flow by acquisition channel instead of treating all users the same.
+
+### Turn ideas into multivariate flags
+
+Product changes are rarely binary. v0 can help turn a concrete idea into a properly structured multivariate feature flag that matches PostHog’s experiment model, making it ready to roll out and measure without additional setup.
+
+**Suggested prompt:**
+
+> Create a multivariate feature flag in PostHog for our new ‘Quick Actions’ button. Variant A is yellow, variant B is green.
+
+**Insights from our Growth team:** Use this for things like CTA color, button placement, or dashboard layout variations. Instead of debating whether a brighter button “feels more clickable,” you can ship both versions behind a multivariate flag and measure downstream impact. Not just clicks, but whether users actually complete the next meaningful action.
+
+### Ask product questions and act on the answers
+
+Understanding what users do often comes down to a few focused questions. v0 can run trends, funnels, and HogQL queries in PostHog and surface the results directly, so decisions about flows or copy are informed by actual usage rather than assumptions.
+
+**Suggested prompt:** 
+
+> Show me a funnel from page view to signup, broken down by referral source.
+
+**Insights from our Growth team:** You can use this when evaluating campaign traffic. If paid users convert differently from organic users, you could generate different landing page variants tailored to intent. It’s also helpful before rewriting homepage copy – if most drop-offs happen before pricing is even viewed, the issue likely isn’t the pricing table.
+
+### Find drop-offs and close the loop
+
+Identifying where users drop off is only useful if it leads to follow-up. With PostHog in v0, you can move directly from analysis to targeted feedback, without stitching together multiple tools.
+
+**Suggested prompt:** 
+
+> Find my worst-performing funnel, then create a survey targeting users who dropped off asking what went wrong.
+
+**Insights from our Growth team:** You can use this for onboarding steps with unexplained friction. If users consistently abandon at, for example, “Connect your first integration,” you can automatically trigger a short survey for that segment and ask whether it’s confusion, missing documentation, or lack of perceived value. That feedback can immediately shape the next iteration.
+
+### Create and summarize surveys
+
+Qualitative feedback is most useful when patterns are clear. v0 can help create surveys and then group responses by theme once data starts coming in, making it easier to move from raw feedback to concrete next steps.
+
+**Suggested prompt:** 
+
+> Create an open-text survey asking users: 'What's the one thing you'd change about our product?' and target it to users who've been active for at least 30 days.
+
+**Insights from our Growth team:** Try to use this after launches or major UI changes. Instead of manually reading hundreds of open-text responses, look for recurring themes like “navigation confusion” or “missing export options.” That will make it easier to prioritize fixes based on frequency and impact rather than on the loudest individual comment. Once survey responses come in, use a follow-up prompt to pull survey stats and identify the most common themes.
+
+### Debug anticipating user impact 
+
+Errors are easier to prioritize when they’re tied to user impact. v0 can query error data from PostHog so investigation starts with which issues affect the most users, not just which ones appeared most recently.
+
+**Suggested prompt:**
+
+> Show me the top errors affecting the most users this week, and any new errors that appeared after yesterday’s deploy.
+
+**Insights from our Growth team:** This should be useful after releases. If a new deploy introduced an error affecting, let's say, 15% of active users in a critical flow, that takes priority over a rare edge-case bug. It will also help you connect technical issues to real user journeys – for example, whether the error blocks upgrade, onboarding, or core usage.
+
+### Keep LLM costs visible
+
+When building AI features, cost trends matter as much as functionality. v0 can surface model-level spend from PostHog so usage decisions are based on actual data rather than surprises at the end of the month.
+
+**Suggested prompt:** 
+
+> Which LLM model is costing me the most this week, and how is the spend trending?
+
+**Insights from our Growth team:** This comes handy when testing different models for AI-powered features. If GPT-4-level performance doesn’t meaningfully improve user outcomes compared to a cheaper model, that’s an immediate optimization opportunity. 
+
+---
+
+Product data is most useful when it shows up at the moment decisions are made. With PostHog available in v0, you can build agents, features, and experiments with real context in mind instead of assumptions. Check it out: [v0.app](https://v0.app/)
+
+To find out more about what you can do with v0 x PostHog (plus snacks and strong opinions about shipping), join us at: 
+
+- February 26 – [Agentic Product Night: **Boston** w/ Vercel x PostHog](https://posthog.com/events#eventId=160)
+- March 10 – [Agentic Product Night: **Amsterdam** w/ Vercel x PostHog](https://posthog.com/events#eventId=161)
+

contents/handbook/content/posthog-style-guide.md

@@ -163,7 +163,7 @@ Please don't use a hyphen instead of en dash. On Macs, holding down `Option` and
 
 ### Images, gifs, and short videos
 
-Most media for your article should be uploaded to Cloudinary.
+Most media for your article should be uploaded to Cloudinary (under 20 MB).
 
 You can do this from posthog.com by signing in, clicking on your avatar in the top right, then clicking **Upload media** in the dropdown menu (available to moderators only).
 
@@ -190,16 +190,22 @@ Short videos (like screen recordings) should be uploaded to Cloudinary.
 There are two other places we host videos:
 
 -   YouTube - videos that are intended for wide distribution
--   Wistia - hosted videos used for embedding on PostHog.com (like our product demos) – like in product presentations
+-   Wistia - hosted videos used for embedding on PostHog.com (like our product demos) – like in product presentations, or for large videos (for blog posts or tutorials) that aren't beneficial to have on social media
+
+#### YouTube embeds
+
+When [embedding YouTube videos](/handbook/engineering/posthog-com/markdown#embedding-youtube-videos), use YouTube's iframe embed code with the "Enabled privacy-enhanced mode" box ticked. This ensures Google doesn't drop a cookie on our website. You'll know it's enabled if the code includes "https://www.youtube-nocookie.com" in the URL. Also add the `allowfullscreen` attribute to the iframe so users have the option to watch the video in fullscreen (useful for reading code snippets).
+
+#### Wistia
+
+<TeamMember name="Cory Watilo" photo /> or <TeamMember name="Jordo Dibb" photo /> can upload videos to Wistia. It's best to also have a thumbnail image which can be uploaded to Wistia as well. Videos can be embedded on the site using our <a href="/handbook/engineering/posthog-com/markdown#embedding-wistia-videos">Wistia component</a>.
 
 ### Best practices for images and videos
 
 -   In most cases, PNGs are the ideal file format. Images are optimized for the web and converted to `webp` automatically. That said, don't upload 4K resolution images. Be sensible.
 
 -   _Do not_ upload animated GIFs. They're large and lossy. Instead, record short clips as MP4s using [Screen Studio](https://www.screen.studio/) and add them to your markdown file as you would any normal image.
 
--   When embedding YouTube videos, use YouTube's iframe embed code with the "Enabled privacy-enhanced mode" box ticked. This ensures Google doesn't drop a cookie on our website. You'll know it's enabled if the code includes "https://www.youtube-nocookie.com" in the URL. Also add the `allowfullscreen` attribute to the iframe so users have the option to watch the video in fullscreen (useful for reading code snippets).
-
 -   If your article needs custom artwork, please file a request. See [Art and branding requests](/handbook/brand/art-requests) for instructions.
 
 ## Technical and docs writing

contents/handbook/engineering/posthog-com/markdown.mdx

@@ -38,7 +38,7 @@ You can create a slider or carousel of images by wrapping them in the `<ImageSli
 
 See an example in our [open-source analytics tools post](/blog/best-open-source-analytics-tools#1-posthog).
 
-## Product videos
+## Videos
 
 Th `<ProductVideo />` component works the same as product screenshots (above) for videos [uploaded to Cloudinary](/handbook/content/posthog-style-guide#adding-media) but supports light and dark videos.
 
@@ -65,6 +65,14 @@ classes="rounded"
 
 _Note: If you don't have a dark video, just leave out the `videoDark` prop and the light video will be used for both color modes._
 
+### Embedding Wistia videos
+
+This can be used in articles like tutorials or blog posts for longer-form videos (where the asset exceeds 20 MB and can't be uploaded to Cloudinary).
+
+```
+<WistiaEmbed mediaId="13hp4af5cc" />
+```
+
 ### Embedding YouTube videos
 
 While not an MDX component, a reminder that when embedding a YouTube video, you should do two things:
@@ -75,6 +83,15 @@ https://www.youtube-nocookie.com/embed/{VIDEO_ID}
 ```
 2. Add the `allowfullscreen` attribute to the iframe so users have the option to watch the video in fullscreen (useful for reading code snippets).
 
+Example:
+
+```
+<iframe
+    src="https://www.youtube-nocookie.com/embed/2jQco8hEvTI?start=375"
+    className="rounded shadow-xl"
+/>
+```
+
 ## Code blocks
 
 The PostHog website has a custom code block component that comes with a number of useful features built-in:

src/mdxGlobalComponents.js

@@ -67,6 +67,7 @@ import { Tweet } from './components/Tweet'
 import { ZendeskTicket } from './components/ZendeskTicket'
 import { CalloutBox } from './components/Docs/CalloutBox'
 import SolvedQuestions from './components/Docs/SolvedQuestions'
+import WistiaEmbed from './components/WistiaEmbed'
 
 export const shortcodes = {
     ArrayCTA,
@@ -137,4 +138,5 @@ export const shortcodes = {
     TaskOwnershipTable,
     RainbowText,
     SolvedQuestions,
+    WistiaEmbed,
 }

src/mdxGlobalComponents.ts

@@ -32,6 +32,7 @@ import SmallTeam from './components/SmallTeam'
 import { StarRepoButton } from './components/StarRepoButton'
 import TaskOwnershipTable from './components/TaskOwnershipTable'
 import TeamMember from './components/TeamMember'
+import WistiaEmbed from './components/WistiaEmbed'
 
 // Global MDX components
 export const shortcodes = {
@@ -70,4 +71,5 @@ export const shortcodes = {
     FeatureOwnershipTable,
     TaskOwnershipTable,
     RainbowText,
+    WistiaEmbed,
 }