Voltar à biblioteca de prompts
Biblioteca de promptsPrompt de imagem

Quadro de sistema de estilo UI

Crie um quadro de sistema de estilo UI com várias páginas, grade de 8px, tokens de cor, escala tipográfica, estados de componentes e exemplos de layout alinhados.

Sistema de designKit UITipografia
Prévia

Prompt de imagem

Modelo recomendado

Seedream 5.0 Lite

Formato de saída

Template de prompt de imagem

Prévia

Prompt de imagem

Prévia de quadro de sistema de estilo UI mostrando tokens de cor, escala tipográfica, estados de componentes e exemplos de layout responsivo.

Prévia para quadro de sistema de estilo UI, focado em consistência do sistema, alinhamento de grade, tokens editáveis e exemplos de UI prontos para produto.

Prompt completo

Quadro de sistema de estilo UI

Quadro de sistema de estilo UI com várias páginas, grade de 8px, tokens de cor, escala tipográfica, componentes e layouts responsivos.

Modelo recomendado: Seedream 5.0 LiteFormato de saída: Template de prompt de imagem
Prompt completo
Prompt de imagem
Crie um quadro de sistema de estilo UI polido, com várias páginas, para [PRODUCT_OR_BRAND]. Apresente o sistema como um conjunto coeso de páginas de design em uma única tela de preview limpa. Use uma grade de espaçamento rigorosa de 8px, margens consistentes, alinhamento preciso e hierarquia clara em todas as páginas. Inclua um painel de tokens de cor com amostras primárias, secundárias, neutras, semânticas e de fundo; uma escala tipográfica com estilos de título, corpo, legenda e números; uma folha de componentes com botões, inputs, cards, navegação, badges e estados vazios; e dois exemplos de layout responsivo mostrando proporções de desktop e mobile. Mantenha o sistema visualmente consistente, editável e adequado para um produto SaaS, ferramenta para criadores, marca de ecommerce ou dashboard interno. Use textos placeholder realistas apenas quando necessário e mantenha rótulos curtos o bastante para permanecerem legíveis. Evite logos reais, sistemas de design copiados, nomes de marca não fornecidos pelo usuário, tipografia distorcida, espaçamento inconsistente, sombras desalinhadas, excesso decorativo, contraste inacessível e exemplos de componentes que quebrem a grade.

Notas de uso

Substitua o tipo de produto, tom da marca, direção de paleta, exemplos de layout, lista de componentes e requisitos de acessibilidade antes de executar.

FAQ do prompt

Antes de usar este prompt

Verificações rápidas de entradas, ajuste de modelo e como adaptar o modelo sem enfraquecer o resultado.

O que devo personalizar primeiro?

Defina o tipo de produto, tom da marca, paleta base, personalidade tipográfica, escopo de componentes e se os exemplos devem parecer mais orientados a marketing ou a dashboard.

Este prompt pode criar um sistema de design utilizável?

Ele cria um quadro visual de sistema de estilo para exploração e apresentação. Revise espaçamento, contraste, tipografia e comportamento dos componentes antes de converter em tokens de UI de produção.

O que devo verificar antes de publicar a imagem?

Confira se os rótulos estão legíveis, se as amostras de cor são distintas, se a hierarquia tipográfica está clara, se os componentes compartilham a mesma lógica de espaçamento e se nenhum sistema real de marca foi copiado.

Mais prompts neste modo