Loading video...

Video Failed to Load

There was a problem loading this video. This could be due to a temporary network issue or the video might be unavailable.

I remember a while ago someone said that Notion doesn't have a design system, so I think I might make something I'll build how I would approach making a Figma kit in the Notion style, with naming conventions and an opinion on component structure and then post to the community

luis.

66,122 subscribers

29,869 views • 1 year ago •via X (Twitter)

Arts Science & Technology Education

Anya Rossi• Live Now

Private livecam show

12 Comments

luis.1 year ago

Work in progress file:

luis.1 year ago

What's curious when inspecting Notion is that they have a lot of CSS classes that match the naming conventions of Figma and there are no CSS variables referenced, styles are inline! This is giving me a hunch that maaaybe they are using some sort of Figma → code conversion 🤔

luis.1 year ago

An immediate decision is to scope organisation – icons used in specific places will live alongside their location For example, home tiles have icons just for those locations, so they will be wrapped in a section alongside (tokens are TBC because of convention inconsistencies)

luis.1 year ago

Here's a fun one – the Notion sidebar border is done using a shadow, and the dividing border on homepage tiles is a filled <div> Both look like borders, so what would you call them? I've gone for Divider as the variable name, feels specific but generic enough for a border

luis.1 year ago

Published a few small additions

RedDeer.Games IR1 year ago

💚 **DROS is Here!** 💚 Dive into this unique #puzzle #platformer set in a mesmerizing #steampunk world by emergeWorlds. Now available on #NintendoSwitch 🎮 Play today! ➡️ @DROS_game #indiegames #indiedev

Ryo Lu1 year ago

there has always been one “design system” at Notion conceptually, in code (somewhat), and in mocks it’s more built out now though for Notion in particular, “systems design” matters way more than “design system”

luis.1 year ago

Love that framing. Thank you for sharing!

milan1 year ago

it was literally the ceo @ivanhzhao .

luis.1 year ago

@ivanhzhao Gulp

Bexel Initiative - Let's Talk Amendments!1 year ago

Curious how youll use grid here.

luis.1 year ago

Will try and add some notes in the thread! I did give grid a go, but it didn't quite work out The Notion site makes heavy use of it though

Related Videos

I haven't fully thought this through but... I think there's a lot of potential in using Figma Make embeds in Figma Design for inline and interactive design system documentation

I haven't fully thought this through but... I think there's a lot of potential in using Figma Make embeds in Figma Design for inline and interactive design system documentation

luis.

23,288 views • 4 months ago

ELON: THE NOTION OF FORGIVENESS IS IMPORTANT “I do believe that the teachings of Jesus are good and wise. There's tremendous wisdom in Turn the other cheek. For a while, when I was hearing that, I thought, that's really a weak thing. And with respect to bullies at school, I think you shouldn't turn the other cheek. You should punch them on the nose and then thereafter make peace with them. But this notion of forgiveness is important. I think it's essential because if you don't forgive, then an eye for an eye makes everyone blind.” Source: Interview with Dr Jordan B Peterson, July 2024

ELON: THE NOTION OF FORGIVENESS IS IMPORTANT “I do believe that the teachings of Jesus are good and wise. There's tremendous wisdom in Turn the other cheek. For a while, when I was hearing that, I thought, that's really a weak thing. And with respect to bullies at school, I think you shouldn't turn the other cheek. You should punch them on the nose and then thereafter make peace with them. But this notion of forgiveness is important. I think it's essential because if you don't forgive, then an eye for an eye makes everyone blind.” Source: Interview with Dr Jordan B Peterson, July 2024

Mario Nawfal

5,638,543 views • 9 months ago

Tom Aspinall on Alex Pereira and Jon Jones distractions ahead of his matchup with Ciryl Gane “I think the notion that I think it’s an easy fight is just outside opinion. I’ve got a very high fight IQ and I know how good he is and I’ve taken it very seriously”

Tom Aspinall on Alex Pereira and Jon Jones distractions ahead of his matchup with Ciryl Gane “I think the notion that I think it’s an easy fight is just outside opinion. I’ve got a very high fight IQ and I know how good he is and I’ve taken it very seriously”

FULL SEND MMA

60,463 views • 8 months ago

A while back, someone asked me to outline my Documentation strategies and structure. Here's a full walkthrough on - how i document - sections - how to think about each section - creating documentation that works! I talk about naming, triggers, included sections, etc.

A while back, someone asked me to outline my Documentation strategies and structure. Here's a full walkthrough on - how i document - sections - how to think about each section - creating documentation that works! I talk about naming, triggers, included sections, etc.

Josh Schultz

10,308 views • 1 year ago

Molly Gordon mentioned Connor Storrie in a recent video about the upcoming film 'Peaked'. "Connor Storrie is brilliant, and I think very perceptive and very curious. So I think that would make a good detective. And also Emma Mackey. I think that they would make an incredible detective duo. […] But I think [filming 'Peaked'] it was such an incredible experience, and I think, hopefully, audience can expect something really funny and insane. And we have such an incredible cast. Like, I feel so lucky with the group of people that came together to make the movie."

Molly Gordon mentioned Connor Storrie in a recent video about the upcoming film 'Peaked'. "Connor Storrie is brilliant, and I think very perceptive and very curious. So I think that would make a good detective. And also Emma Mackey. I think that they would make an incredible detective duo. […] But I think [filming 'Peaked'] it was such an incredible experience, and I think, hopefully, audience can expect something really funny and insane. And we have such an incredible cast. Like, I feel so lucky with the group of people that came together to make the movie."

Connor Storrie Updates | Fansite

80,499 views • 2 months ago

I used Figma Make to build the most delightful link library and book cover configurator ever vibecoded. For the Contra x Figma Makeathon, I decided to build an app to turn my 47 open tabs into a beautiful book. Then I put it on a shelf for the whole internet to browse. It's called Stash For each collection, you have the opportunity to design the best cover ever using the in-app configurator. It has pencils, markers, stamps, graffiti... The entire thing is made in Figma, including stamps, illustrations, and graffiti artworks. I think this is my best public work so far and I hope it lets me leave a mark on the internet.

I used Figma Make to build the most delightful link library and book cover configurator ever vibecoded. For the Contra x Figma Makeathon, I decided to build an app to turn my 47 open tabs into a beautiful book. Then I put it on a shelf for the whole internet to browse. It's called Stash For each collection, you have the opportunity to design the best cover ever using the in-app configurator. It has pencils, markers, stamps, graffiti... The entire thing is made in Figma, including stamps, illustrations, and graffiti artworks. I think this is my best public work so far and I hope it lets me leave a mark on the internet.

Noman

30,679 views • 3 months ago

I was ready to tear my (remaining) hair out. Every shadcn UI kit for Figma I found on Figma Community was of poor quality, missing components or outdated. 😡 My client's deadline loomed, and I needed a solution fast... That's when inspiration struck. With my seven years of experience creating Figma resources and managing the Ant Design System, why not make the kit myself? 🤔 I dove in, pouring my expertise into every component. Days blended as I crafted, refined, and perfected. 🥵 Finally, I sat back and smiled. Before me was the high-quality, up-to-date Shadcn UI kit I'd been searching for, complete with customer support. 🤩 As I prepared to share it with the world, I felt a surge of excitement. This wasn't just a solution to my problem – it was a resource that could help thousands of other designers and developers. It’s not a dream. I made it.

I was ready to tear my (remaining) hair out. Every shadcn UI kit for Figma I found on Figma Community was of poor quality, missing components or outdated. 😡 My client's deadline loomed, and I needed a solution fast... That's when inspiration struck. With my seven years of experience creating Figma resources and managing the Ant Design System, why not make the kit myself? 🤔 I dove in, pouring my expertise into every component. Days blended as I crafted, refined, and perfected. 🥵 Finally, I sat back and smiled. Before me was the high-quality, up-to-date Shadcn UI kit I'd been searching for, complete with customer support. 🤩 As I prepared to share it with the world, I felt a surge of excitement. This wasn't just a solution to my problem – it was a resource that could help thousands of other designers and developers. It’s not a dream. I made it.

Matt

190,233 views • 1 year ago

changed how I design with AI. I show how to build faster by adding a design system directly into the prompt, importing any website URL to get a strong starting point, then polishing everything in my own style. I also mix it with components and skills to keep the design consistent and more unique. GPT-5.5 cloning websites is honestly crazy good. The result can get very close to the original, then you can refine it and make it your own. Full breakdown in the comments.

changed how I design with AI. I show how to build faster by adding a design system directly into the prompt, importing any website URL to get a strong starting point, then polishing everything in my own style. I also mix it with components and skills to keep the design consistent and more unique. GPT-5.5 cloning websites is honestly crazy good. The result can get very close to the original, then you can refine it and make it your own. Full breakdown in the comments.

FHILY👑

57,007 views • 1 month ago

New Replit 🤝 Notion integration just dropped. Real-time read/write to Notion DBs. I vibe-coded a support portal with clean UI and Notion backend. See how it works and build your own 👇

New Replit 🤝 Notion integration just dropped. Real-time read/write to Notion DBs. I vibe-coded a support portal with clean UI and Notion backend. See how it works and build your own 👇

Manny Bernabe

29,450 views • 1 year ago

How Jason Calacanis Got Claw-Pilled: An AI Agent Prompted Itself to Build Him a CRM in Seconds “ The moment I became Claw-pilled, I was like, ‘Hey, I want to build my network, I know these 20 people in Japan, I had dinner with them during my recent trip, I want to know who they know, so check out LinkedIn and other things, and who they're associated with, and make me a mind map of it, and then the next trip I want to meet with the next circle of those connections.’” “It's like, ‘Okay, I got the results,’ and it said, ‘Where do you want me to put them?’” “I was like, ‘Well, where can you put them?’” “And it said, ‘I can put it in a Google sheet, I can put it in a Notion table, I can put it here, I could give you a PDF, I could give you a CSV file, or I could write you a CRM.’ And I was like, ‘Yeah, sure, make me a CRM system…’ and it made a CRM system.” “I think maybe 1/1000 people working with AI have had that experience. Maybe it's 1/10,000, where your agent says, ‘I'll make you bespoke software.’ The context is so good because the memory's getting better. When did that happen?” Perplexity CEO Aravind Srinivas: “I think it happened with Opus 4.5. That was the inflection point when models started being amazingly good at orchestration, and reasoning, and tool calls.” “The models started becoming very good at handling the context, so the context window no longer became a problem, and that made it suddenly so good at doing very long orchestration tasks.” —------------------------------------------ Our episode is sponsored by the New York Stock Exchange - a modern marketplace and exchange for building the future. It all happens at the NYSE 🏛 -

How Jason Calacanis Got Claw-Pilled: An AI Agent Prompted Itself to Build Him a CRM in Seconds “ The moment I became Claw-pilled, I was like, ‘Hey, I want to build my network, I know these 20 people in Japan, I had dinner with them during my recent trip, I want to know who they know, so check out LinkedIn and other things, and who they're associated with, and make me a mind map of it, and then the next trip I want to meet with the next circle of those connections.’” “It's like, ‘Okay, I got the results,’ and it said, ‘Where do you want me to put them?’” “I was like, ‘Well, where can you put them?’” “And it said, ‘I can put it in a Google sheet, I can put it in a Notion table, I can put it here, I could give you a PDF, I could give you a CSV file, or I could write you a CRM.’ And I was like, ‘Yeah, sure, make me a CRM system…’ and it made a CRM system.” “I think maybe 1/1000 people working with AI have had that experience. Maybe it's 1/10,000, where your agent says, ‘I'll make you bespoke software.’ The context is so good because the memory's getting better. When did that happen?” Perplexity CEO Aravind Srinivas: “I think it happened with Opus 4.5. That was the inflection point when models started being amazingly good at orchestration, and reasoning, and tool calls.” “The models started becoming very good at handling the context, so the context window no longer became a problem, and that made it suddenly so good at doing very long orchestration tasks.” —------------------------------------------ Our episode is sponsored by the New York Stock Exchange - a modern marketplace and exchange for building the future. It all happens at the NYSE 🏛 -

The All-In Podcast

170,827 views • 3 months ago

Min Heejin: So anyway, I want to take on this kind of new challenge. For the next project, I probably won’t be making a girl group. Well, maybe in the future I could, but for now, I have no plans. And if I do make a group, it would be a boy group. That’s just my style—it’s always been retro-inspired. After a boy group comes out, then a girl group might follow. But in any case, I want to create something new that can unfold in a fresh way. Yes, because I have ideas in my head. I can see gaps and areas that are lacking in the current market and I think that if those areas are filled, it could create an interesting impact. That’s why I want to try something like that.

Min Heejin: So anyway, I want to take on this kind of new challenge. For the next project, I probably won’t be making a girl group. Well, maybe in the future I could, but for now, I have no plans. And if I do make a group, it would be a boy group. That’s just my style—it’s always been retro-inspired. After a boy group comes out, then a girl group might follow. But in any case, I want to create something new that can unfold in a fresh way. Yes, because I have ideas in my head. I can see gaps and areas that are lacking in the current market and I think that if those areas are filled, it could create an interesting impact. That’s why I want to try something like that.

.

21,409 views • 6 months ago

THIS! "I think in Q1 I was easily getting through on that one set of tyres and they pulled me in when I was like seven tenths up and then I put a new tyre on so I lost the two that I would have, the extra tyre that I would have for Q3." "I think that definitely probably, I would imagine that cost me a couple of tenths probably at the end, going from a used to a new.. but nonetheless, it wouldn't have been pole but so a perfect lap I probably would have been maybe third or something." - F1 2025 Monaco -

THIS! "I think in Q1 I was easily getting through on that one set of tyres and they pulled me in when I was like seven tenths up and then I put a new tyre on so I lost the two that I would have, the extra tyre that I would have for Q3." "I think that definitely probably, I would imagine that cost me a couple of tenths probably at the end, going from a used to a new.. but nonetheless, it wouldn't have been pole but so a perfect lap I probably would have been maybe third or something." - F1 2025 Monaco -

sim

192,485 views • 1 year ago

🚀 Notion → Replit, now automated with Custom MCPs Checkout the demo below on how to: ✅ Use Notion AI to generate a PRD for an app ✅ Use Replit Agent to build the app and integrate it with Notion database 🚀 ✅ Define in Notion. Build in Replit. From strategy to software in minutes. ✨

🚀 Notion → Replit, now automated with Custom MCPs Checkout the demo below on how to: ✅ Use Notion AI to generate a PRD for an app ✅ Use Replit Agent to build the app and integrate it with Notion database 🚀 ✅ Define in Notion. Build in Replit. From strategy to software in minutes. ✨

Replit ⠕

43,948 views • 6 months ago

A couple weeks ago I said that while first and foremost BRICS is an “economic” alliance, it would be naive to think there’s not a military component to this. We’re robbing China and Iran on the high seas. Israel will have America at war with all of its enemies, all at once.

A couple weeks ago I said that while first and foremost BRICS is an “economic” alliance, it would be naive to think there’s not a military component to this. We’re robbing China and Iran on the high seas. Israel will have America at war with all of its enemies, all at once.

Stew Peters

132,080 views • 6 months ago

Saw a post on LinkedIn where someone mentioned the possibility of banks building AI that could detect when a user is under duress and automatically lock their banking app. This idea got me thinking about a different approach: a dual-password system I designed in #design #figma

Saw a post on LinkedIn where someone mentioned the possibility of banks building AI that could detect when a user is under duress and automatically lock their banking app. This idea got me thinking about a different approach: a dual-password system I designed in #design #figma

designwithkingsley

15,085 views • 1 year ago

I'm really loving Claude Design more than I thought I would, so much so I blew through limits on 2 (!!!) accounts testing it. So here it is, the $200-in-overages Claude Design review + walkthrough you've been waiting for. I show you: - how to set up (or steal) a design system - why I think product marketers are sleeping on Claude Design - who I think this product kills (spoiler: not Figma) - my nits + feedback, which mostly have to do with latency--so much time sauteeing onions--and how every time I test an anthropic product, I get rate limited before a magic moment. BONUS: I walk through the brand new ChatGPT Images 2.0 model, which gets rid of typography slop and improves significantly on layout work. As always, a big thank you to our wonderful sponsors: 💼 WorkOS - Make your app enterprise-ready today: 🚀Rippling - Stop wasting time on admin tasks, build your startup faster: A fast 25 minutes on YT:

claire vo 🖤

70,690 views • 2 months ago

Harry about why he chose to do residencies in certain cities on Zane Lowe “I think it makes the show better. I think you can build something that doesn't have to travel every night. I think the show itself is better. I think there's something in this that allows me to like stay in my life while I'm doing it and therefore I think allows me to take care of myself better, which I think makes me better at doing the thing. It's not like I'm saying I'll never travel again, but I want to see what it looks like if you do it a different way. And you know, people in my band have like families now and kids and some aspect of that, too. It's really important to me that they're on the road that I would love to like have them and I don't want to make it like near impossible for them to be able to do that with me.”

Harry about why he chose to do residencies in certain cities on Zane Lowe “I think it makes the show better. I think you can build something that doesn't have to travel every night. I think the show itself is better. I think there's something in this that allows me to like stay in my life while I'm doing it and therefore I think allows me to take care of myself better, which I think makes me better at doing the thing. It's not like I'm saying I'll never travel again, but I want to see what it looks like if you do it a different way. And you know, people in my band have like families now and kids and some aspect of that, too. It's really important to me that they're on the road that I would love to like have them and I don't want to make it like near impossible for them to be able to do that with me.”

HSNews

282,165 views • 3 months ago

A phenomenal 10 mins with Carol Vorderman on 🔥 It begins with an intro, then from 1:23 onwards, "We've had a Conservative government which is in my opinion corrupt.. During covid we have the VIP PPE lane.. Then we had partygate.." "I started digging and I just started to scratch the surface on so many Tory issues and Tory contracts. And it's like a fountain of contracts and money that goes back to Tory donors and associates" "I feel I have a responsibility that if I see something I show it to others"

A phenomenal 10 mins with Carol Vorderman on 🔥 It begins with an intro, then from 1:23 onwards, "We've had a Conservative government which is in my opinion corrupt.. During covid we have the VIP PPE lane.. Then we had partygate.." "I started digging and I just started to scratch the surface on so many Tory issues and Tory contracts. And it's like a fountain of contracts and money that goes back to Tory donors and associates" "I feel I have a responsibility that if I see something I show it to others"

Farrukh

1,435,065 views • 2 years ago

This is the most valuable resource I have ever created I wrote a brand new, extremely detailed Notion guide on every single strategy to save money on taxes The best of my content in a single place Want a free copy? - Like / RT this post - Reply with "GUIDE" and I'll DM you

Ankur Nagpal

178,675 views • 8 months ago