O emaranhado do Tailwind: Parece acquainted?
Se você é como eu e passa um bom pedaço do seu dia trabalhando com CSS do Tailwind, provavelmente sentiu esse pequeno ponto de atrito: aulas infinitamente aprimoradas, abordando entre o seu editor e o navegador, apenas para ver como as coisas na verdade olhar. Ou talvez você esteja cavando as ferramentas de desenvolvimento, tentando identificar exatamente qual combinação de courses de utilidade está estilizando um elemento? 😩
Pode ser um assassino de fluxo de trabalho actual e quebrar seu foco.
Apresentando lente de cauda: seu editor de vento de cauda no navegador ✨
E se você pudesse cortar as courses Intermediary e Editar Tailwind ao vivodiretamente na sua página, com suggestions visible instantâneo?
É exatamente por isso que estou animado para compartilhar Lente de caudauma extensão do navegador em que tenho trabalhado para resolver essas frustrações exatas. Ele atua como sua ferramenta de desenvolvimento de navegador, que permite clicar em qualquer elemento e ajustar suas courses de vento de cauda na página.
As mudanças aparecem instantaneamente, para que você possa ver os resultados à medida que edita. Sugestões de classe inteligente, suporte a JIT V3/V4 + de Tailwind V3/JIT e navegação de elementos rápidos e muito mais.
O que a lente da cauda pode fazer por você?
Veja mais de perto o que a lente de cauda traz para o seu fluxo de trabalho de vento de cauda:
Recurso |
Descrição |
---|---|
👁️ Visualização de classe instantânea |
Passe o mouse sobre qualquer elemento para ver imediatamente todas as courses aplicadas em vento de cauda. Não há mais escavação nas ferramentas de dev! |
⚡ Editar e visualizar ao vivo |
Pesquise, adicione ou troca aulas de vento de cauda e veja as alterações instantaneamente em sua página, sem atualização. |
💡 Alternativas inteligentes |
Obtenha sugestões inteligentes para courses alternativas que você pode aplicar com um único clique. |
📏 Sobreposições visuais |
Visualize claramente a margem, o preenchimento, a altura e o posicionamento com sobreposições dinâmicas e em tempo actual. |
↩️ Desfazer/refazer o suporte |
Experimente livremente! Desfazer ou refazer facilmente as alterações que você fizer. |
🛠️ Config pronto |
Suporte whole para o Tailwind CSS V3/V4 e o personalizado do seu projeto |
⌨️ Navegação dom |
Inspecione rapidamente elementos de pai ou filho usando atalhos simples de teclado para um fluxo de trabalho mais rápido. |
Por que eu construí lentes de cauda
Eu construí lentes de cauda porque realmente queria uma ferramenta como essa para meus próprios projetos. O objetivo é simples: mantê -lo no fluxo, reduzir essa troca frustrante de contexto e, finalmente, tornar o trabalho com o poder incrível do CSS do Tailwind CSS ainda mais agradável e produtivo.
Experimente a lente da cauda: grátis por 7 dias! 🚀
Pronto para dar uma volta e ver como ele se encaixa no seu fluxo de trabalho?
Você pode experimentar a versão completa da lente de cauda grátis por 7 dias. Sem compromissos, apenas uma likelihood de ver a mágica acontecer.
🔗 Mergulhe na demonstração rápida e comece aqui:
Acesso ao longo da vida e atualizações futuras
Após o julgamento, se você achar lente de cauda tão indispensável quanto eu espero que você seja, é uma compra única de US $ 30 para uma licença vitalícia. Isso inclui todas as atualizações futuras e você pode usá -lo em dispositivos ilimitados.
Amor do usuário
Vamos ouvir de você! 👇
Eu ficaria emocionado ao ouvir qualquer suggestions, idéias ou perguntas que você tenha.
- Quais são seus maiores desafios ao trabalhar com o CSS do Tailwind no dia-a-dia?
- Uma ferramenta como lente de cauda poderia ajudar a simplificar seu processo?
Deixe seus pensamentos, sugestões, ou mesmo apenas um “olá” nos comentários abaixo!
Codificação feliz!