🎥 Copying other website's Design.MD File. Is it stealing?

Take a look at this exchange between the creator of Tailwind CSS and James Quick, who is also a notable figure in the development community. This whole get the design markdown file for any website and make your own website look like a shitty version of somebody else's website thing is depressing. Some of you actually want that. To which James said, yes. And he said, so you just want to grab like a Raycast design markdown file and create a product as indistinguishable from Raycast landing page as possible. To which James said, I think you're sincerely oversimplifying this and oversimplifying how challenging it is for someone who doesn't have your background and what he means by design. So, in this video I'm going to give you my take, but first we are going to use one of these tools. One is called getdesign.md and we are going to do a live test to see just how accurately and just how much of a design it actually steals. And I'm going to integrate it into a real project I've been working on now. So, as you can see right here, there's a bunch of different websites um that are, you know, large websites like Claude for instance. If you click on this, you come down here, it shows you what you will get as a as far as the design system is concerned. And the idea is is you just run this command up here, npx get design at latest add Claude. the name of this particular design system. And when you do that and you ask your AI to integrate it, then your website will look and feel like Claude. I'm clicking here on Bugatti and Bugatti obviously the high-end car manufacturer. This is their design system as you could see. So, I like the typography. I think it's kind of cool and we're going to integrate this command right here. And we're going to see just how close it actually matches the real Bugatti website. So, I'm in the project folder right now of a project I've been working on for the past several months. A lot of you know about it. It's the pull training and drill training system with projection and all that stuff and I'm going to have it create or recreate a landing page with that design system. So here's that command. I'm just going to go ahead and run this and here it is. So tell your coding agent to use this file as a reference before writing any UI. Customize it as your project evolves. I'm not going to read these prompts but as you can see the first prompt I'm just asking it to integrate and create a secondary home page using the new design.md file that's been included in the project. And then the second one I'm going to ask it to spawn four different Figma design agents to design in Figma first using that design system so that we can then possibly customize it within Figma ourselves. Okay, so here is the actual website in the browser. This isn't the Figma design agent and what it produced. We're going to take a look at that afterwards. So I think real quickly before I scroll down and show you the rest of this. This is the actual Bugatti website. I this is their home page. As you can see I'm just scrolling down. I it's it's nice. Nothing wrong with that at all. It has its own style. It has its own typography. It has its own colors essentially. So how does this look and feel? All right. Now obviously it does it didn't have access to like, you know, images to put inside of the hero. So a lot of this is kind of cookie cutter but scrolling down I Yeah, this is actually pretty solid and I would say it's a good representation of, you know, their design system set in the context of my app. Now of course there's not any pictures of pool tables or anything like that but it did a pretty good job of kind of capturing the essence of the Bugatti brand, right? So let me show you now over here at Figma and what it produced. Now it produced pretty much the same kind of idea where there was no assets so I did put in a pool table graphic from my 3D editor that's actually a part of the app. And I'm going to show you the first one. So as you can see here Um, concept except now we're just in Figma and now we have the ability though to make custom adjustments to it. Now, that's not to say that you can't make adjustments to the browser version and code. You just talk to Claude and tell it to, you know, change things or whatever. Um, but as far as I it being theft and copying, you know, what Bugatti did exactly to a T, I I would say no, it's not really theft, but I would say it's lame if you extracted exactly what their design MD file was without making changes and making it custom and making it unique for your website. And that's why Adam said, "I don't really get why people want to take and extract a design MD file and then integrate it just to create a crappier version." So, why would it be a crappier version though? I mean, it's doing a pretty good job right here. Well, the reason that he has some merit to what he's saying is because when you have your own individual project that's a serious project with its own unique needs and components and layouts, the AI isn't always able to integrate it perfectly from a design system from your design MD file. That requires an eye for design to be able to know what needs to change. That's why when you create a copy of an existing website, but you have no design experience, you're not sure what to look like, it's not going to look as good. But James Quick also has a point too because if you have zero design experience, but you're trying to just put out a project, well, then this can serve as a great starting point. So, I think the middle ground here is yeah, try to make it unique. Don't do a one-to-one rip or copy based on a design system that served as the foundation for your layout and your project. So, what I would do, I would change the secondary font, which is a really strong serif font. I don't think that would really match the tone and the feel of my project, which is very technology-based. So, if I just take this Garamond font and change it maybe to something like Manrope, okay, we've just made a custom adjustment. So, now I can go ahead and here in Figma at least, I can tell the AI over here to to replace all instances of that Garamond font with Manrope. All right, so it went ahead and it adjusted all that typography. So, let's also go ahead and ask it to change perhaps all instances of the of the buttons that show up and we'll give it a primary color. All right, here we go. Now we actually have a slightly different color scheme cuz we have a primary color. It's not monochromatic with grayscale and we also I have adjusted the button designs as well. You can do this iteratively to kind of make these designs your own and I don't think it's theft, I think it's inspiration as long as you do it in an honest way. And this sort of thing has existed for a long time. We've had templates since the late 90s, template monster.com. This is just the modern incarnation of templates and anybody knows, any skilled designer knows that even back then with the template marketplace, I you can spot when somebody's not a non-designer who integrates one of these templates and tries to make custom adjustments when they have no design skill, it becomes very obvious. So, my point in saying that is if you're a skilled designer, you should not feel threatened by people stealing your designs. You're the original, the OG creator of the design and more often than not, people who try to swap it and and steal it, they're they're going to do a crappier job. A copy of your original is almost always going to be inferior as long as you have skill. So, let me know if you guys actually use design systems like this as a base for your projects. Um, what are your thoughts? Do you think it's actual theft? Let me know what you think in the comments. I will see you all very soon with more content and goodbye.