Fudge
O que é Fudge?
O Fudge é um motor de referências de design com inteligência artificial que ajuda agentes de programação a criar sites melhores através da pesquisa e análise de milhares de sites reais em produção. Fornece capturas de ecrã acompanhadas de informações de design medidas, como tipografia, cores, espaçamento, disposição, componentes, tipos de página, conteúdos multimédia, interações, contraste, margens, raios, sombras e gradientes. O Fudge funciona através de MCP com ferramentas como Codex, Cursor e Claude Code, e a sua extensão para o Chrome permite aos utilizadores guardar sites e detalhes de design para utilizar mais tarde. Os agentes podem usar o Fudge para descobrir inspiração, comparar direções visuais, analisar fontes e sistemas de cores, encontrar correspondências para capturas de ecrã e exportar sistemas de design para Tailwind CSS, variáveis CSS ou JSON.
Como usar Fudge?
Instale o Fudge com o comando de configuração npx -y @withfudge/design@latest setup numa ferramenta de programação com IA compatível. Peça ao seu agente para encontrar inspiração de design, fontes, cores, disposições, tipos de página ou sites semelhantes a uma captura de ecrã. O agente pode analisar as referências correspondentes e utilizar os respetivos detalhes de tipografia, cores, espaçamento, disposição e componentes durante o desenvolvimento. Também pode instalar a extensão do Chrome para guardar sites ou secções específicas de páginas para pesquisas futuras e coleções de projetos.
Principais recursos da Fudge
Pesquisar milhares de sites reais em produção por estilo, disposição, cor, fonte, tipo de página, componente, domínio ou semelhança visual
Fornecer capturas de ecrã com informações medidas sobre tipografia, cores, espaçamento, disposição, componentes, contraste, margens, raios, sombras, gradientes e conteúdos multimédia
Analisar as fontes utilizadas e descobrir fontes semelhantes ou combinações de fontes
Encontrar páginas como páginas de preços, painéis, documentação, fluxos de integração, páginas de início de sessão, portefólios e páginas de apresentação
Comparar uma captura de ecrã carregada com sites que tenham uma aparência visual semelhante
Guardar sites e secções de páginas com a extensão do Chrome
Organizar referências guardadas em coleções de projetos para reutilização
Pesquisar e comparar referências de design guardadas em conversas com agentes de IA
Exportar tipografia, cores, espaçamento, raios, sombras e gradientes para Tailwind CSS, variáveis CSS ou JSON
Funcionar com ferramentas de programação com IA compatíveis com MCP, incluindo Codex, Cursor e Claude Code
Analisar funções das cores, contraste de acessibilidade, cores de texto legíveis e escalas cromáticas
Preservar conteúdos multimédia, vídeo, recortes, movimento, interações, sobreposições, recortes de elementos, janela de visualização e contexto da captura quando relevante
Casos de uso da Fudge
Encontrar referências de design reais para uma nova página de apresentação de um produto SaaS
Descobrir combinações de fontes serifadas para um tipo de letra sem serifa existente
Encontrar sites que utilizem uma fonte específica, como Merriweather ou Anthropic Serif
Exportar as fontes e cores de um site para um tema Tailwind
Encontrar páginas de preços escuras com tipografia de destaque serifada, raios apertados, sombras suaves e contraste acessível nos botões de ação
Comparar uma captura de ecrã com sites que tenham uma direção visual semelhante
Estudar padrões de design de fintech antes de criar um produto financeiro
Guardar e comparar referências de sites em vários projetos de design
Dar a um agente de programação com IA orientações visuais concretas em vez de pedidos vagos como moderno ou premium
Analisar a disposição e o sistema de design de um site de produto estabelecido antes de recriar uma interface semelhante
Perguntas frequentes de Fudge
O que fornece o Fudge a um agente de programação com IA?
Quais são as ferramentas de programação com IA compatíveis com o Fudge?
O Fudge pode pesquisar fontes e combinações de fontes?
É possível exportar o sistema de design de um site com o Fudge?
Posso guardar os sites que descobrir?
O Fudge permite fazer pesquisas visuais com base em capturas de ecrã?
O que guarda o Fudge além de uma captura de ecrã?
O Fudge tem um plano gratuito?
O plano gratuito exige cartão de crédito?
Em que difere o Fudge das galerias de inspiração de design?
Avaliações de Fudge (0)
Preço de Fudge
Gratuito
0 $ por mês
25 consultas Fudge por dia, acesso ao servidor MCP e pesquisa e análise de referências de sites reais. Não é necessário cartão de crédito.
Pro
29 $ por mês
Consultas Fudge ilimitadas, pesquisa de sites e fontes, comparação de capturas de ecrã, ferramentas de cor, gravação através do Chrome, exportação para Tailwind v4, variáveis CSS e JSON, coleções ilimitadas e suporte prioritário. A faturação anual oferece um desconto de 17%.
Análise de Fudge
Fudge Análise de tráfego do site
Tráfego geográfico
Top 2 Regiões
Fudge Iniciar incorporações
Use os emblemas do site para obter o apoio de sua comunidade para o lançamento do Toolify. Eles são fáceis de incorporar em sua página inicial ou rodapé.
Alternativa de Fudge
Escuta de mídias sociais