LibreAI / Design / Design-Learn
// design · GalaxyXieyu/Design-Learn

Design-Learn

Design-Learn é um projeto de design de código aberto de GalaxyXieyu (GalaxyXieyu/Design-Learn no GitHub). Tem 172 estrelas no GitHub e 16 forks, é publicado sob a licença MIT e foi atualizado pela última vez no GitHub em 19 de abril de 2026.

Extract any site's design language into reusable rules for AI coders

💎 Joia escondida★ 172 estrelas⑂ 16 forksMITatualizado abr 2026
▦ visual: o README deste projeto não inclui nenhuma captura incorporável,
então aqui vai um marcador. O guia abaixo está completo mesmo assim.
// dados do projeto

Dados do projeto

Estrelas no GitHub
172
Forks
16
Licença
MIT
Última atualização no GitHub
19 de abril de 2026
Categoria
Design
Tipo de ficha
Joia escondida: uma página mais breve para um projeto menos conhecido
Site oficial
Official site
// como funciona

Como funciona

  1. Install the extension

    Add Design-Learn to Chrome.

  2. Visit a reference

    Open the site whose style you like.

  3. Extract rules

    The tool analyzes the UI into design tokens.

  4. Feed to AI

    Give the rules to your AI coding tool.

// recursos

Por que as pessoas gostam tanto

Design extraction

Turn any site into UI rules.

Design tokens

Colors, spacing, type as data.

Chrome extension

Analyze while you browse.

AI-ready output

Rules your coder can follow.

UI analysis

Structured design-system view.

MIT licensed

Free for commercial use with attribution.

Advertisement
// execute você mesmo

Execute você mesmo

  1. Step 1 — Clone the repo

    Download the source and move into the project folder.

    git clone https://github.com/GalaxyXieyu/Design-Learn.git
    cd Design-Learn
  2. Step 2 — Check the README

    Every project documents its own setup; start with install requirements.

    cat README.md | head -60
  3. Step 3 — Run it

    Follow the project's launch command — Docker, pip, npm, or a binary release.

    # see README for the exact launch command
// casos de uso

O que você pode criar

Advertisement
// perguntas frequentes

Perguntas frequentes

Who maintains Design-Learn?

It is an open-source project at GalaxyXieyu/Design-Learn with 162 forks. Check the repo's contributors and recent commits to see how active maintenance is.

Is Design-Learn free for commercial use?

MIT licensed — commercial use allowed with attribution.

How do I use it?

As a Chrome extension — visit a site, extract, feed to AI.

Which AI tools accept the rules?

Any coding assistant that takes design context — see the docs.

Does it copy the site?

It extracts design language into rules, not the site's assets.

// continue explorando

Ferramentas semelhantes

Design

Screenshot To Code

Drop in a screenshot and convert it to clean code (HTML/Tailwind/React/Vue)

★ 80,0 mil estrelasMIT
Ver o guia →
Design

Penpot

Penpot: The open-source design platform for Product teams that need scalable collaboration

★ 60,6 mil estrelasMPL-2.0
Ver o guia →
Design

Onlook

The Developer Tool for Designers • An Open-Source AI-First Design tool • Visually build, style, and edit your code with AI • World's…

★ 26,9 mil estrelasApache-2.0
Ver o guia →
Design

dembrandt

Extract any website's design system — logo, colours, typography and tokens — in one command.

★ 3,6 mil estrelasMIT
Ver o guia →
Design

wibi-style

36 installable visual-design skills for Codex — turn photos into artwork

★ 162 estrelasCustom
Ver o guia →
// alternativas

Alternativas em Design

Os outros projetos de Design com mais estrelas no catálogo do LibreAI — a lista realista de alternativas se Design-Learn não for o ideal para você.

// mais em design

Mais em Design

Projetos de Design próximos no catálogo, os mais próximos em estrelas de Design-Learn: continue explorando dos dois lados dele.

Baixe o Design-Learn

Grátis e aberto: pegue o código-fonte, dê uma estrela no repositório e comece a criar.