cloudflare-site-crawler

Name: cloudflare-site-crawler
Availability: InStock
Author: stringztechnologies

Crawl websites to extract design tokens from CSS files.

Updated Mar 13, 2026

Search Tags:#design tokens #web scraping #cloudflare #css extraction #website analysis #brand matching

Ready to run

npx skills add https://github.com/stringztechnologies/stringz-framework --skill cloudflare-site-crawler

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: cloudflare-site-crawler
Source: https://github.com/stringztechnologies/stringz-framework/tree/main/skills/cloudflare-site-crawler
Command: npx skills add https://github.com/stringztechnologies/stringz-framework --skill cloudflare-site-crawler

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill automates the extraction of design tokens (colors, fonts, spacing, shadows, border-radius) from live websites, enabling precise brand matching and design system analysis.

Core Features & Use Cases

CSS Token Extraction: Parses CSS files to identify and extract design-related properties.
Visual Brand Verification: Crucially, it emphasizes human or AI judgment to confirm dominant brand colors against raw CSS data, preventing misinterpretations.
Use Case: You need to replicate the exact look and feel of a client's existing marketing website for a new web application. This skill will extract all the CSS variables, colors, fonts, and radii, and guide you through a visual verification to ensure brand consistency.

Quick Start

Run the cloudflare-site-crawler skill to extract design tokens from https://example.com.

Frequently Asked Questions about cloudflare-site-crawler

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I extract design tokens like colors and fonts from a live website's CSS?▼

Visual brand verification confirms dominant brand colors against raw CSS data, preventing misinterpretations during website analysis. This step ensures the extracted design tokens accurately reflect the true visual appearance rather than just raw stylesheet values.

Can I extract CSS design tokens if the target website blocks web scraping?▼

Yes, you can extract CSS design tokens from blocked sites because the Skill supports fallback strategies for web scraping. It also offers optional Cloudflare Browser Rendering API integration to handle access restrictions and successfully parse the required stylesheets.

Do I need the Cloudflare Browser Rendering API to perform CSS extraction and website analysis?▼

You do not need the Cloudflare Browser Rendering API for CSS extraction, as it is an optional integration. Standard parsing handles basic website analysis, while the API serves as a fallback strategy for sites that block direct web scraping attempts.

What's the best way to replicate an existing website's exact look and feel for a new web application?▼

The best way to replicate a website's look and feel is extracting its design tokens, including spacing, shadows, and border-radius. This Skill parses the live CSS and guides visual verification to ensure brand consistency before you build the new application.