# The best Next.js cookie bar

ID: youtube:Pot1e5CRtR4
Canonical HTML: https://robotostudio.com/videos/the-best-next-js-cookie-bar
Original source: https://www.youtube.com/watch?v=Pot1e5CRtR4
Author: Jono Alford
Published: 2025-07-18T00:00:00.000Z
Edited: 2026-08-11
Source checked: 2026-09-17T13:02:04.791Z
Language: en
Directory publisher: Roboto Studio
Text: original source material.

## Scope and gaps
- Video authors are credited by the original Roboto page; individual transcript speakers remain unassigned.

## Original source text

It's Inth and c15t, it's fast, it's open source, it's everything we could have dreamed of and more. Here's the best cookie bar for Next.js.

## Full transcript

Origin: Edited transcript from the original Roboto page

Hey folks, how's it going? I want to do this video today because I really want to talk about this thing, uh, just over here. This is, uh, C-15T, and more specifically it's C-15T hosted on consent.io. Um, it's an incredible cookie bar. Um, I don't think most people know it even exists. I didn't know it existed, and I am so stoked to actually talk about it.

Um, so one of the first things that you'll notice is this is styled perfectly like the rest of the Robboto Studio website. It's fully, fully customizable. We're using Tailwind CSS to style this, but you can do whatever you want. If you want to use styled components, if you want to use Tailwind, whatever it is, it works great.

Soon as you see, uh, this load up, I'll show you how fast this thing is, by the way. So just with a refresh, obviously you probably want to do a full refresh. So feel free to go visit the website and see for yourself. Um, but you can see it's ludicrously fast. It loads up in like 100 milliseconds.

Um, talking about that, there is a website called cookiebench.com which tells you the best performing cookies and the worst performing cookies, which is the ones that we always have to implement and it drives us crazy because you hate going from like a 100 out of 100 on a performance score to dropping down to, like, literally in some cases, you know, 80, 70, just from the cookie banner. So really, really cool tool.

Um, so again, the hosting side of this is consent. Feel free to have a look over there. Look at that beautiful logo on the bottom as well. Um, but they're using, you can see how well they've actually customized this themselves. Totally different from what we're using.

Um, and again, C-15T, this is the coolest bit if you want my honest opinion. Um, the entire setup for our website was literally step one. We didn't need to do database migrations. We literally ran this tool and it did everything. The only thing that caught us out when we were building was we forgot to put the environmental variable in, which is, you know, everybody does it. Schoolboy error.

But we're using PMP. So feel free to use this with Turbo Start Sanity, Turbo Start Contempt, whatever tool you want to use. Obviously, they're the best tools, but feel free. Um, I just want to tell people about it. It's awesome. I haven't been sponsored to say this. I love it. Take care. Have a great day.

## Timestamped captions

### segment-1
[2.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=2)
Hey folks, how's it going? I want to do

### segment-2
[2.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=2)
Hey folks, how's it going? I want to do
this video today because I really want

### segment-3
[4.4s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=4)
this video today because I really want

### segment-4
[4.4s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=4)
this video today because I really want
to talk about this thing uh just over

### segment-5
[7.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=6)
to talk about this thing uh just over

### segment-6
[7.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=6)
to talk about this thing uh just over
here. This is uh C-15T and more

### segment-7
[9.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=9)
here. This is uh C-15T and more

### segment-8
[9.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=9)
here. This is uh C-15T and more
specifically it's C15T hosted on

### segment-9
[11.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=11)
specifically it's C15T hosted on

### segment-10
[11.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=11)
specifically it's C15T hosted on
consent.io.

### segment-11
[13.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=13)
consent.io.

### segment-12
[13.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=13)
consent.io.
Um it's an incredible cookie bar. Um I

### segment-13
[15.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=15)
Um it's an incredible cookie bar. Um I

### segment-14
[15.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=15)
Um it's an incredible cookie bar. Um I
don't think most people know it even

### segment-15
[17.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=17)
don't think most people know it even

### segment-16
[17.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=17)
don't think most people know it even
exists. I didn't know it existed and I

### segment-17
[19.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=19)
exists. I didn't know it existed and I

### segment-18
[19.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=19)
exists. I didn't know it existed and I
am so stoked to actually talk about it.

### segment-19
[21.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=21)
am so stoked to actually talk about it.

### segment-20
[21.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=21)
am so stoked to actually talk about it.
Um so one of the first things that

### segment-21
[22.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=22)
Um so one of the first things that

### segment-22
[22.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=22)
Um so one of the first things that
you'll notice is this is styled

### segment-23
[24.3s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=24)
you'll notice is this is styled

### segment-24
[24.3s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=24)
you'll notice is this is styled
perfectly like the rest of the Robboto

### segment-25
[26.4s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=26)
perfectly like the rest of the Robboto

### segment-26
[26.4s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=26)
perfectly like the rest of the Robboto
Studio website. It's fully fully

### segment-27
[28.2s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=28)
Studio website. It's fully fully

### segment-28
[28.2s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=28)
Studio website. It's fully fully
customizable. We're using Tailwind CSS

### segment-29
[30.5s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=30)
customizable. We're using Tailwind CSS

### segment-30
[30.5s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=30)
customizable. We're using Tailwind CSS
to style this, but you can do whatever

### segment-31
[32.4s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=32)
to style this, but you can do whatever

### segment-32
[32.4s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=32)
to style this, but you can do whatever
you want. If you want to use styled

### segment-33
[33.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=33)
you want. If you want to use styled

### segment-34
[33.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=33)
you want. If you want to use styled
components, if you want to use Tailwind,

### segment-35
[35.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=35)
components, if you want to use Tailwind,

### segment-36
[35.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=35)
components, if you want to use Tailwind,
whatever it is, it works great. Soon as

### segment-37
[37.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=37)
whatever it is, it works great. Soon as

### segment-38
[37.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=37)
whatever it is, it works great. Soon as
you see uh this this load up, I'll show

### segment-39
[39.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=38)
you see uh this this load up, I'll show

### segment-40
[39.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=38)
you see uh this this load up, I'll show
you how fast this thing is, by the way.

### segment-41
[40.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=40)
you how fast this thing is, by the way.

### segment-42
[40.2s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=40)
you how fast this thing is, by the way.
So, just with a refresh, obviously, you

### segment-43
[41.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=41)
So, just with a refresh, obviously, you

### segment-44
[41.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=41)
So, just with a refresh, obviously, you
probably want to do a full refresh. So,

### segment-45
[43.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=43)
probably want to do a full refresh. So,

### segment-46
[43.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=43)
probably want to do a full refresh. So,
feel free to go visit the website and

### segment-47
[44.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=44)
feel free to go visit the website and

### segment-48
[44.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=44)
feel free to go visit the website and
see for yourself. Um, but you can see

### segment-49
[46.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=46)
see for yourself. Um, but you can see

### segment-50
[46.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=46)
see for yourself. Um, but you can see
it's ludicrously fast. It loads up in

### segment-51
[48.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=48)
it's ludicrously fast. It loads up in

### segment-52
[48.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=48)
it's ludicrously fast. It loads up in
like 100 milliseconds. Um, talking about

### segment-53
[51.3s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=51)
like 100 milliseconds. Um, talking about

### segment-54
[51.3s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=51)
like 100 milliseconds. Um, talking about
that, there is a website called

### segment-55
[52.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=52)
that, there is a website called

### segment-56
[52.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=52)
that, there is a website called
cookiebench.com which tells you the best

### segment-57
[55.3s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=55)
cookiebench.com which tells you the best

### segment-58
[55.3s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=55)
cookiebench.com which tells you the best
performing cookies and the worst

### segment-59
[57.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=57)
performing cookies and the worst

### segment-60
[57.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=57)
performing cookies and the worst
performing cookies, which is the ones

### segment-61
[58.3s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=58)
performing cookies, which is the ones

### segment-62
[58.3s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=58)
performing cookies, which is the ones
that we always have to implement and it

### segment-63
[59.9s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=59)
that we always have to implement and it

### segment-64
[59.9s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=59)
that we always have to implement and it
drives us crazy because you hate going

### segment-65
[61.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=61)
drives us crazy because you hate going

### segment-66
[61.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=61)
drives us crazy because you hate going
from like a 100 out of 100 on a

### segment-67
[63.5s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=63)
from like a 100 out of 100 on a

### segment-68
[63.5s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=63)
from like a 100 out of 100 on a
performance score to dropping down to

### segment-69
[65.3s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=65)
performance score to dropping down to

### segment-70
[65.4s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=65)
performance score to dropping down to
like literally in some cases, you know,

### segment-71
[67.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=66)
like literally in some cases, you know,

### segment-72
[67.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=66)
like literally in some cases, you know,
80 70 just from the cookie banner. So,

### segment-73
[69.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=69)
80 70 just from the cookie banner. So,

### segment-74
[69.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=69)
80 70 just from the cookie banner. So,
really, really cool tool. Um, so again,

### segment-75
[71.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=71)
really, really cool tool. Um, so again,

### segment-76
[71.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=71)
really, really cool tool. Um, so again,
the hosting side of this is consent.

### segment-77
[74.4s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=74)
the hosting side of this is consent.

### segment-78
[74.4s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=74)
the hosting side of this is consent.
Feel free to have a look over there.

### segment-79
[75.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=75)
Feel free to have a look over there.

### segment-80
[75.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=75)
Feel free to have a look over there.
Look at that beautiful logo on the

### segment-81
[77.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=77)
Look at that beautiful logo on the

### segment-82
[77.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=77)
Look at that beautiful logo on the
bottom as well. Um, but they're using,

### segment-83
[79.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=78)
bottom as well. Um, but they're using,

### segment-84
[79.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=78)
bottom as well. Um, but they're using,
you can see how well they've actually

### segment-85
[80.2s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=80)
you can see how well they've actually

### segment-86
[80.2s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=80)
you can see how well they've actually
customized this themselves. Totally

### segment-87
[82.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=81)
customized this themselves. Totally

### segment-88
[82.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=82)
customized this themselves. Totally
different from what we're using. Um, and

### segment-89
[84.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=84)
different from what we're using. Um, and

### segment-90
[84.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=84)
different from what we're using. Um, and
again, C-15, this is the coolest bit if

### segment-91
[86.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=86)
again, C-15, this is the coolest bit if

### segment-92
[86.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=86)
again, C-15, this is the coolest bit if
you want my honest opinion. Um, the

### segment-93
[87.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=87)
you want my honest opinion. Um, the

### segment-94
[87.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=87)
you want my honest opinion. Um, the
entire setup for our website was

### segment-95
[89.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=89)
entire setup for our website was

### segment-96
[89.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=89)
entire setup for our website was
literally step one. We didn't need to do

### segment-97
[92.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=92)
literally step one. We didn't need to do

### segment-98
[92.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=92)
literally step one. We didn't need to do
database migrations. We literally ran

### segment-99
[94.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=94)
database migrations. We literally ran

### segment-100
[94.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=94)
database migrations. We literally ran
this tool and it did everything. The

### segment-101
[96.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=96)
this tool and it did everything. The

### segment-102
[96.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=96)
this tool and it did everything. The
only thing that caught us out when we

### segment-103
[98.3s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=98)
only thing that caught us out when we

### segment-104
[98.3s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=98)
only thing that caught us out when we
were building was we forgot to put the

### segment-105
[99.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=99)
were building was we forgot to put the

### segment-106
[99.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=99)
were building was we forgot to put the
environmental variable in, which is, you

### segment-107
[102.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=101)
environmental variable in, which is, you

### segment-108
[102.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=102)
environmental variable in, which is, you
know, everybody does it. School boy

### segment-109
[103.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=103)
know, everybody does it. School boy

### segment-110
[103.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=103)
know, everybody does it. School boy
error. But we're using PMP. So feel free

### segment-111
[106.2s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=106)
error. But we're using PMP. So feel free

### segment-112
[106.2s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=106)
error. But we're using PMP. So feel free
to use this with Turbo Start Sanity,

### segment-113
[108.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=108)
to use this with Turbo Start Sanity,

### segment-114
[108.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=108)
to use this with Turbo Start Sanity,
Turbo Start Contempt, whatever tool you

### segment-115
[110.4s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=110)
Turbo Start Contempt, whatever tool you

### segment-116
[110.4s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=110)
Turbo Start Contempt, whatever tool you
want to use. Obviously, they're the best

### segment-117
[112.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=111)
want to use. Obviously, they're the best

### segment-118
[112.0s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=112)
want to use. Obviously, they're the best
tools, but feel free. Um, I just want to

### segment-119
[114.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=114)
tools, but feel free. Um, I just want to

### segment-120
[114.1s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=114)
tools, but feel free. Um, I just want to
tell people about it. It's awesome. I

### segment-121
[115.7s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=115)
tell people about it. It's awesome. I

### segment-122
[115.8s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=115)
tell people about it. It's awesome. I
haven't been sponsored to say this. I

### segment-123
[117.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=117)
haven't been sponsored to say this. I

### segment-124
[117.6s](https://www.youtube.com/watch?v=Pot1e5CRtR4&t=117)
haven't been sponsored to say this. I
love it. Take care. Have a great day.

## Questions answered on the original page

### What is c15t?
c15t is an open-source cookie consent and banner library for modern web apps. It ships with sensible styling defaults but is fully customizable, so you can use Tailwind, styled-components, or your own setup. Inth (https://inth.com/) is the hosted version of c15t, which is the easiest way to use it in production.
Source: https://robotostudio.com/videos/the-best-next-js-cookie-bar

### What is the best cookie banner for Next.js?
c15t hosted on Inth is the recommendation here. It's open source, loads in roughly 100ms, integrates as a single setup step (no database migrations), and matches whatever styling system your Next.js app already uses. Performance is what sets it apart: most cookie banners noticeably tank Lighthouse scores, and this one barely moves the needle.
Source: https://robotostudio.com/videos/the-best-next-js-cookie-bar

### What is Inth?
Inth (https://inth.com/) is the hosted product behind the c15t open-source library, previously known as consent.io. You get the same banner and consent flow without running the back end yourself. Connect it to your Next.js (or other) app, drop in an environment variable, and the banner is live. The styling is fully customizable so it doesn't look like an off-the-shelf widget.
Source: https://robotostudio.com/videos/the-best-next-js-cookie-bar

### Is c15t open source?
Yes. c15t is open source, and Inth is the hosted commercial offering built on top of it. You can self-host the open-source library or pay for the managed version, depending on whether you want to run the consent storage and dashboard yourself.
Source: https://robotostudio.com/videos/the-best-next-js-cookie-bar

### How fast is the c15t cookie banner?
Around 100 milliseconds to render, based on the demo in the video. That matters because most cookie banners are responsible for noticeable performance drops; going from a Lighthouse score of 100 to 70-80 just because of the banner is common. c15t is designed to avoid that, which is why cookiebench.com is a useful place to compare options.
Source: https://robotostudio.com/videos/the-best-next-js-cookie-bar

### How do you add a cookie banner to a Next.js app?
With c15t and Inth it's a single install step plus an environment variable. There are no database migrations to run, and the library works out of the box with Tailwind, styled-components, or whatever else your project uses. The hardest part is remembering to set the environment variable, which is the one thing that tripped Roboto Studio up during their setup.
Source: https://robotostudio.com/videos/the-best-next-js-cookie-bar

### Does c15t handle GDPR?
Yes. c15t is designed around modern consent requirements (GDPR, CCPA), and Inth stores the consent records on your behalf if you want a managed setup. You still need a cookie policy on your site, but the banner, opt-in/opt-out flow, and consent storage are what c15t handles for you.
Source: https://robotostudio.com/videos/the-best-next-js-cookie-bar