Setup Brand Kit : Website Scraper
The Brand Kit Web Scraper automatically extracts your brand’s styles like fonts, colors, logos, and button designs directly from your website. This helps us build your Brand Kit faster by analyzing how your brand is represented online.
Note
This process is automated, and websites use different structures and technologies. Some results may be partial, approximate, or require manual refinement.
Elements Included in Your Brand Kit Scan
It started with scanning heading and body text to capture font families, sizes, weights, and colors for consistent brand typography. Below table defines what web scrapper captures and its expected behavior.
| Element | What It Captures | Details |
|---|---|---|
| Fonts and Text Styles(Typography) | Headings (H1–H4) and body text | Captures font family, size, weight, line height, spacing, and text color. If a Google Font is detected, a Google Fonts link is generated for reuse. |
Not Included in the Typography Scan
- System fonts that do not have downloadable links.
- Complex font setups like, Adobe Typekit, custom hosted fonts may not resolve correctly.
- If a website removes or changes a font, the stored link in the Brand Kit may break.
It identifies and extracts logo images from key website areas like headers, navigation, and footers. Below table defines what web scrapper captures and its expected behavior.
| Element | What It Captures | Details |
|---|---|---|
| Logos | Logo images from your website | Detects images tagged/named “logo” and checks header, navigation, and footer areas. |
Not Included in the Logo Scan
- Logos embedded as background images or inline SVGs may not be captured.
- Some false positives may appear, like, logos from client carousels.
- Inline Scalable Vector Graphics(SVG) logos are intentionally excluded.
- Images with a
.webpextension may not render properly in email campaigns.
It collects and maps frequently used text, background, and link colors to define your primary brand palette. Below table defines what web scrapper captures and its expected behavior.
| Element | What It Captures | Details |
|---|---|---|
| Color Palette | Website colors | Collects all visible text, background, border, and link colors. Generates a frequency map to highlight commonly used (likely brand) colors. |
Not Included in the Color Palette Scan
- It captures all colors, including temporary states (hover, disabled) and third-party widget colors.
- Manual filtering is required to isolate brand colors.
It detects button designs and classifies primary, secondary, and tertiary styles based on usage and prominence. Below table defines what web scrapper captures and its expected behavior.
| Element | What It Captures | Details |
|---|---|---|
| Button Styles | Website button designs | Detects <button> and <a class="btn"> elements and extracts text, font, color, border, and background styles. Buttons are scored to identify primary, secondary, and tertiary styles. |
Not Included in the Button Style Scan
- Hover, focus, and disabled states are not captured.
- Size-based variations like small/large buttons may not be distinguished.
- Some properties like padding, shadows, transitions are not included.
Create Brand Kit Using Website Scrapper
- Log in to your Netcore CE dashboard and navigate to Content > Brand Kit > Create using website.
- Enter your website URL and click GENERATE
And that's it, your Brand Kit has been generated using the Website Scraper. You can start using it right away or customize it further to match your exact brand guidelines.
Brand Kit Scan
Our Brand Kit Web Scraper gives you a solid first draft of your brand’s styles by scanning your website for fonts, colors, logos, and button designs.
Every website is built differently, Below is the expectation from our Web Scraper:
- Dynamic Content: We capture visible styles, but elements that appear only on hover, click, or animation may need manual review.
- Modern Frameworks: We detect most styles from React, Vue, or Angular sites, but a few deeply embedded styles may require a quick manual update.
- Third-Party Content: Iframes, like payment forms or social widgets are not included, keeping your Brand Kit focused only on your core brand elements.
- Website Security: Some sites block automated tools, so results may vary based on site settings.
- Large Websites: Scans may include extra design data. This gives you flexibility to refine and choose only the styles that match your brand guidelines.
Frequently Asked Questions
Q. Why does my Brand Kit show extra or random colors?
A. Because the scraper collects all visible colors on your site (including widgets, hover states, or temporary UI colors). A designer should refine this to the real brand palette.
Q. Why is my logo missing?
A If your logo is an inline SVG or background image, the scraper may not capture it. You can manually upload it later.
Q. Why do my fonts look incomplete or generic?
A. System fonts (e.g., Arial, Times New Roman) don’t have links. Custom fonts (Adobe Typekit, self-hosted) may not resolve. The scraper defaults to the detected font-family name.
Q. Why are hover/active button styles not included?
A. The scraper takes a static snapshot of the page. Capturing hover or click states requires user simulation, which isn’t supported in this version.
Q.Can this replace my brand guidelines?
A. No. This is a time-saving tool to build a starting Brand Kit. Final brand guidelines still need manual review and design validation.
Q. What happens if my website changes later?
A.The Brand Kit reflects your site at the time of scraping. If you update fonts, logos, or colors, you’ll need to re-run the scraper.
Q. Can you guarantee 100% accuracy?
A.No. Due to web complexity, results are best-effort. Manual corrections are expected.
Updated 5 months ago