How to Clone a Websites Visual Style Legally and Ethically

Designers learn by studying sites they admire, and most design styles are shared freely. What you can't take is someone else's actual work: their code, images, writing, logos or paid fonts. Here's where the line usually falls. This is general information, not legal advice.

Usually fine to borrow

• General styles: minimal layouts, rounded cards, big type, dark themes, generous white space.
• Layout patterns: a hero section, a three-column feature grid, a sticky header.
• Color ideas: a warm, muted palette or a bold accent color. Single colors and common combinations aren't owned by anyone.
• Type choices: pairing a serif heading font with a sans-serif body, very large headlines, or wide letter spacing on small labels.
• Interaction ideas: how a menu opens, or how cards react on hover, rebuilt in your own code.

Not yours to take

• Code: copying a site's HTML, CSS or JavaScript wholesale copies their work.
• Images, illustrations and icons they made or licensed.
• Text: headlines, product descriptions and other copy.
• Logos and brand names, protected by trademark.
• A look so close it confuses people. In some countries, a distinctive overall look (trade dress) can be protected when copying it would make people think you're the same company.
• Fonts: paid fonts need your own license. See web font licensing.

Study it properly

• Font Detector shows the font, size, weight and line height of any text you click.
• Color Palette Extractor lists a page's most-used colors.
• See how to work out a site's design system.

Make it your own

1. Collect several sources, not one. Take the spacing from one, the type scale from another, the mood from a third.
2. Change the colors. Shift hues or build your palette from your own brand. See choosing a palette from your brand.
3. Pick similar fonts you can license, such as free alternatives on Google Fonts.
4. Use your own photos and writing.
5. Write your own code, or start from a template whose license allows it.

A quick test

Put your design next to the original. Would a visitor think it's the same company, or recognize copied images or text? If so, change more. If it only feels like the same style, you're doing what designers have always done. When in doubt, especially for a business site, ask a lawyer before launch.