Tudo que a Ilse faz.

Aponte, ajuste no painel ou descreva — no app de verdade. O que dá para aplicar sem IA a Ilse aplica; o resto vai para o seu agente.

Apontar e ajustar
01

Apontar e dizer

Clique num elemento, selecione um texto ou desenhe uma área, e escreva o que deve mudar. A Ilse acha o arquivo e a linha no código e entrega o pedido ao seu agente.

Uma área desenhada num espaço vazio vira criação: diga o que deve entrar ali.

02

Painel de propriedades

Ajuste você mesmo: posição (com X/Y), tamanho (Fixed · Hug · Fill), fluxo, alinhamento, gap, padding e margin por lado, tipografia e alinhamento do texto, cores, borda, arredondamento, opacidade e efeitos (sombra e blur). Os valores vêm da escala e dos tokens do seu projeto, e a mudança aparece na hora.

As listas começam com None (zero). Em Stroke, + adiciona uma borda e − tira.

03

Só este ou todos

Quando o elemento faz parte de um componente repetido na página, escolha: só este, ou All · N — e a prévia mostra a mudança em todas as instâncias de uma vez.

04

Componentes no painel

Selecione um componente e o painel mostra as props e variantes dele, lidas do seu código (tipos, cva(), como ele é usado) ou dos tipos de uma biblioteca. Escolha outra variante e a Ilse reescreve essa prop onde a instância está escrita, sem IA.

Uma mudança numa instância fica nela. Para mudar todas, escolha Todos.

05

Duplicar

Duplique uma linha de lista e o agente acrescenta um item novo aos dados dela; duplique qualquer outro bloco e ele escreve uma cópia do JSX. Arraste a cópia para onde quiser e mude o estilo dela no painel: ela vai para lá, com esse estilo, e o original fica como estava.

06

Mover de verdade

Arraste para reordenar, ou para dentro e para fora de containers. O arrasto move o que está selecionado, não o pai. A página reflui ao vivo, e o agente muda a ordem na fonte — no JSX ou no array que gera a lista.

07

Redimensionar

Puxe as alças, com snap-to-grid, e a página reage enquanto você arrasta. O botão ↰ sobe a seleção para o elemento pai — num gráfico, do <svg> para a caixa que o contém.

Dentro de um SVG, o clique pega o <svg> inteiro; ⌘-clique (Ctrl) pega o elemento exato, como um path de ícone.

08

Editar texto

Elementos de texto ganham um campo Text no topo do painel. Texto escrito direto no JSX muda sem IA; texto que vem de variável, prop ou tradução vai para o agente, que troca na origem.

09

Remover elemento

[ vídeo em breve ]

Remove element no fim do painel, ou a tecla Delete com a nota vazia. Numa lista gerada por .map, só aquele item sai — a não ser que Apply to diga todos.

10

Lápis

[ vídeo em breve ]

Rabisque sobre a página: circule, risque, aponte. Os traços são lidos e vão junto com a nota.

11

Imagens de referência

[ vídeo em breve ]

Cole um print do Figma ou de outra tela, ou faça upload. Imagens viram referência visual para o agente; SVGs são copiados para o projeto como assets.

12

Pausar animações

[ vídeo em breve ]

Congele tooltips, toasts e dropdowns para anotar o que some rápido demais.

Biblioteca e design system
13

Biblioteca de componentes

Os componentes do seu projeto numa aba só. Busque pelo nome ou pelo que o componente faz, veja onde cada um está na página e abra a seção Componente dele.

Arrastar componentes para a página e as cópias de cada um ficam no Ilse Pro.

14

Criar design system

Um clique (ou ilse ds) e a Ilse escreve o .ilse/ds/DESIGN.md a partir do seu código: os componentes com props e variantes, e os tokens (cores, espaçamento, raio, tipografia, sombras). Sem IA, em segundos.

Adicionar ao AGENTS.md (ou CLAUDE.md) aponta qualquer agente para ele, e o seu agente passa a usar os seus componentes e tokens mesmo com a Ilse fechada.

Aplicar
15

O degrau mais barato

Um Run manda tudo junto. Ajustes do painel que viram uma classe do Tailwind são aplicados pela própria Ilse, na hora e sem IA. Pedidos pequenos vão para o modelo rápido do seu agente; mudanças maiores, para o agente completo.

Você vê cada correção chegando na página e pode parar o agente a qualquer momento.

16

Desfazer

[ vídeo em breve ]

⌘Z volta passo a passo enquanto você ajusta. Depois de aplicado, restaura os arquivos da última mudança; ⇧⌘Z refaz. Sem pedir para a IA reverter, e o histórico continua lá mesmo depois de reiniciar a Ilse.

17

Sem recarregar

O que você viu em prévia continua na tela até a página mostrar a mudança de verdade. Se ela não aparecer sozinha, a Ilse pede ao framework que renderize de novo, sem perder o estado. Pedir para você recarregar é o último recurso.

18

A página não quebra

Depois de uma mudança, um erro novo na página (uma key repetida do React, uma exceção não tratada) aparece com Pedir correção, Desfazer e Ignorar. E se o agente mexer em outra tela, a barra avisa.

19

CI verde

Depois de cada mudança, a Ilse roda o typecheck do projeto e os testes que cobrem o que mudou. O que a mudança quebrou, o agente corrige antes de dizer que terminou. Falhas que já existiam não entram na conta.

20

Memória do projeto

Em Configurações → Memória do projeto: as mudanças de design que a Ilse fez aqui, com a sua nota, e o que ainda não tem commit.

21

Seu agente, sua conta

A Ilse roda o Claude Code, Codex, Cursor CLI ou Gemini CLI que você já usa, na sua conta — ou o seu agente puxa as anotações pelo MCP. A Ilse não tem conta, chave nem servidor, e nada sai da sua máquina.

O que o agente recebe

Antes de chamar o seu agente, a Ilse faz a busca por ele. Cada pedido chega com:

  • ▸O arquivo e a linha do elemento, com só o trecho que importa
  • ▸O componente que escreveu o JSX, onde ele é definido e onde é usado
  • ▸Os estilos filtrados pela intenção ("cor errada" manda só cor)
  • ▸Os tokens de design do seu projeto e o DESIGN.md, quando existe
  • ▸As últimas mudanças da Ilse naquele arquivo, para não desfazer uma correção anterior
  • ▸A sua nota e os comandos do painel, do arrasto e do redimensionamento
  • ▸Referências coladas e o escopo: só este ou todos
© 2026 ilse. Feito com craft.