Ferramentas
63 posts
Bem-vindo ao dpw 2026!
O blog foi reconstruído do zero com Astro 5, MDX, SCSS com ITCSS e mais. Conheça a stack, as decisões técnicas e o que mudou nesta nova versão.
Ler artigoBFB 2: seu próximo boilerplate front end
Conheça o BFB 2: seu próximo boilerplate front-end moderno. Parcel, ITCSS e hot reloading para base profissional com zero configuração. Comece rápido!
Ler artigoEditorConfig: padronização automática de estilo de código
EditorConfig: padronize automaticamente estilos de código no projeto. Acabe de vez com discussões sobre tabs vs espaços e mantenha consistência na equipe!
Ler artigoBasic Front Boilerplate (BFB)
Conheça o BFB: boilerplate front-end com Parcel, arquitetura profissional e zero configuração. Ideal para tutoriais e projetos rápidos com ES6.
Ler artigodpw expo #40 - ApexCharts.js, Sal.js, Moveable, Cropper.js, FilePound
Explore ApexCharts, Sal.js, Moveable, Cropper.js e FilePond no dpw expo. Gráficos modernos, scroll animations e upload/crop de imagens profissional. Teste!
Ler artigodpw expo #39 - International Telephone Input, Focus Overlay, JustGage
Explore International Telephone Input, Focus Overlay e JustGage no dpw expo. Input telefone internacional, overlays de foco e gauges animados. Confira!
Ler artigodpw expo #38 - Jurassic Ninja, typical, gameController.js
Explore Jurassic Ninja, Typical e GameController.js no dpw expo. WordPress temporário para testes, efeitos de digitação e gamepads web. Incrível!
Ler artigodpw expo #37 - roughViz.js, free-for.dev, Swiper
Explore Roughviz.js, Free-for.dev e Swiper no dpw expo. Gráficos estilo sketch artístico, recursos grátis para devs e slider mobile moderno. Teste!
Ler artigodpw expo #36 - React Bolt, Butter Cake, Browserhacks
Explore React Bolt, Butter Cake e Browserhacks no dpw expo. Componentes React ultra rápidos, CMS headless moderno e hacks de navegadores. Descubra!
Ler artigodpw expo #35 - react-spinners-css, SimpleBar, CopyPalette
Explore React Spinners CSS, SimpleBar e CopyPalette no dpw expo. Loaders React elegantes, scrollbar customizada minimalista e paletas de cores. Teste!
Ler artigodpw expo #34 - Can I email, clipboard.js, Flawwwless ui
Explore Can I Email, Clipboard.js e Flawwwless UI no dpw expo. Compatibilidade HTML email, copiar para clipboard fácil e galeria de designs. Confira!
Ler artigodpw expo #33 - filesize.js, Radial Menu, UI Interactions
Explore Filesize.js, Radial Menu e UI Interactions no dpw expo. Formatação de tamanhos de arquivo, menus radiais e coleção de micro-interações. Veja!
Ler artigodpw expo #32 - Image Map Generator, Divjoy, SVG Artista
Explore Image Map Generator, Divjoy e SVG Artista no dpw expo. Crie mapas HTML clicáveis, apps React e arte SVG profissional. Confira agora!
Ler artigodpw expo #31 - Page Transitions, Hopscotch, Agile CSS Framework
Explore Page Transitions, Hopscotch e Agile CSS no dpw expo. Transições suaves entre páginas, tours guiados interativos e framework CSS leve. Teste!
Ler artigodpw expo #30 - collectorium, perfundo, npkill
Explore Collectorium, Perfundo e npkill no dpw expo. Biblioteca de padrões UI, lightbox minimalista elegante e limpeza de node_modules pesados!
Ler artigodpw expo #29 - TypeLighter.js, Codeimg.io, Vuestic Admin
Explore Typelighter.js, Codeimg.io e Vuestic Admin no dpw expo. Highlight de texto elegante, screenshots de código e dashboard admin Vue.js completo!
Ler artigodpw expo #28 - simplePARALLAX, Gitfolio, CSS Border Animations
Explore simpleParallax, Gitfolio e CSS Border Animations no dpw expo. Parallax ultra fácil, portfólio automático do GitHub e bordas animadas. Teste!
Ler artigodpw expo #27 - Gradient Magic, Text stripes, git-pending
Explore Gradient Magic, Text Stripes e Git Pending no dpw expo. Gradientes CSS prontos incríveis, efeitos de texto e gerenciamento de commits pendentes. Teste!
Ler artigodpw expo #26 - Tabulator, react-image-magnifiers, SuperTinyIcons
Explore Tabulator, React Image Magnifiers e Super Tiny Icons no dpw expo. Tabelas interativas poderosas, zoom de produtos e ícones SVG minúsculos. Teste!
Ler artigodpw expo #25 - List.js, 26 recursos VS Code 2019, Color Thief
Explore List.js, recursos do VS Code 2019 e Color Thief no dpw expo. Listas com busca/sort, extensões essenciais e extração de paletas de imagens. Teste!
Ler artigodpw expo #24 - Animista, Static Site Boilerplate, Humanize Duration
Explore Animista, Static Site Boilerplate e Humanize Duration no dpw expo. Gerador de animações CSS, starter kit moderno e formatação de tempo. Experimente!
Ler artigodpw expo #23 - Frappe Charts, Darkmode.js, Eva Design System
Explore Frappe Charts, Darkmode.js e Eva Design System no dpw expo. Gráficos simples e bonitos, dark mode automático e design system completo. Teste!
Ler artigodpw expo #22 - Shape.so, MoveTo.js, uiGradients
Explore Shapes.io, MoveTo.js e UIGradients no dpw expo. Editor SVG visual interativo, scroll animado suave e coleção de gradientes CSS prontos. Teste!
Ler artigodpw expo #21 - freezeframe.js, Spotlight.js, Microjs
Explore Freezeframe.js, Spotlight.js e Microjs no dpw expo. Controle inteligente de GIFs, galeria de imagens overlay e catálogo de micro-frameworks. Veja!
Ler artigodpw expo #20 - Transfonter, Specificity Calculator, ms
Explore Transfonter, Specificity Calculator e ms no dpw expo. Conversor de fontes webfont, calculadora de especificidade CSS e parser de tempo. Útil!
Ler artigodpw expo #19 - Scene.js, Pressure.js, pixelmatch
Explore Scene.js, Pressure.js e Pixelmatch no dpw expo. Animações baseadas em timeline, detecção de pressão touch e diff visual de imagens. Confira!
Ler artigodpw expo #18 - Zdog, Pickr, CSS Grid Generator
Descubra Zdog, Pickr e CSS Grid Generator no dpw expo #18. Engine 3D pseudo-3D para Canvas/SVG, color picker moderno e gerador visual de grids. Teste!
Ler artigodpw expo #17 - micron.js, Tailwind CSS, Tornis
Explore Micron.js, Tailwind CSS e Tornis no dpw expo. Micro-interações elegantes, utility-first CSS e detecção de eventos do navegador. Teste!
Ler artigodpw expo #16 - CSSFX, iziModal, Tippy.js
Explore CSSFX, iziModal e Tippy.js no dpw expo #16. Efeitos CSS prontos para copiar, modais JavaScript customizáveis e tooltips modernos. Confira demos!
Ler artigodpw expo #15 - iziToast, animate.css, CSS3 Transform
Explore iziToast, Animate.css e CSS3 Transform no dpw expo. Notificações elegantes e customizáveis, animações prontas e transformações CSS. Teste agora!
Ler artigodpw expo #14 - Ikonate, SortableJS, TypeIt
Descubra Ikonate, SortableJS e TypeIt no dpw expo. Ícones SVG totalmente customizáveis, drag-and-drop nativo e efeitos de digitação. Experimente!
Ler artigodpw expo #13 - Buefy, BootboxJS, Uppy
Conheça Buefy, BootboxJS e Uppy no dpw expo. Framework Vue.js com Bulma, diálogos JavaScript elegantes e upload de arquivos moderno. Teste já!
Ler artigodpw expo #12 - Medium Zoom, ICONSVG, Choices.js
Explore Medium Zoom, IconSVG e Choices.js no dpw expo. Zoom de imagens estilo Medium, ícones SVG gratuitos e select boxes customizáveis. Experimente!
Ler artigodpw expo #11 - Perflink, CrumbJS, iro.js
Explore Perflink, CrumbJS e iro.js no dpw expo. Ferramentas essenciais para performance web, breadcrumbs dinâmicos e seleção de cores moderna. Teste!
Ler artigodpw expo #10 - DevDocs, Editor.js, RFS
Explore DevDocs, Editor.js e RFS no dpw expo. Hub de documentação offline, editor moderno por blocos e tipografia responsiva automatizada. Confira agora!
Ler artigodpw expo #9 - Micromodal.js, mockAPI, Color.review
Explore Micromodal.js, MockAPI e Color Review no dpw expo. Modais acessíveis e leves, API fake para testes e análise de contraste de cores. Confira!
Ler artigodpw expo #8 - removebg, Cleave.js, NSFW JS
Explore Remove.bg, Cleave.js e NSFW.js no dpw expo. Remoção de fundo automática com IA, formatação de inputs e detecção de conteúdo impróprio. Teste!
Ler artigodpw expo #7 - Lozad, PulltoRefresh.js, StackBlitz
Explore Lozad, PulltoRefresh.js e StackBlitz no dpw expo. Lazy loading ultra performático, pull-to-refresh mobile e IDE online completa. Teste agora!
Ler artigodpw expo #6 - Rellax, spacetime, AmplitudeJS
Explore Rellax, Spacetime e AmplitudeJS no dpw expo. Biblioteca parallax ultra leve, manipulação de timezone e player de áudio HTML5 elegante. Teste!
Ler artigodpw expo #1: k6, CSS Reference, Coolors.co
Explore k6, CSS Reference e Coolors.co no dpw expo. Testes de carga profissionais, referência CSS completa e gerador de paletas de cores. Essenciais!
Ler artigoRetrospectiva 2018
Relembre 2018 no dpw: breakpoints CSS, CSS Blocks da LinkedIn, otimização de estilos e novo tema do blog. Veja os artigos que marcaram o ano!
Ler artigoCSS Blocks: introdução à API
Conheça CSS Blocks da LinkedIn: otimizador revolucionário que reescreve CSS para máxima performance. Introdução à API e casos de uso práticos. Otimize!
Ler artigoLinkedIn anuncia CSS Blocks, o novo otimizador de CSS
Descubra CSS Blocks da LinkedIn: tecnologia que otimiza automaticamente seu CSS. Aprenda como reduzir drasticamente o tamanho dos arquivos CSS. Revolucionário!
Ler artigoOs melhores bancos de imagem grátis (stock images)
Descubra os melhores bancos de imagem grátis (stock images) de alta qualidade. Recursos com fotos livres de direitos autorais para projetos web. Baixe!
Ler artigoColorblind Web Page Filter: acessibilidade por simulação de deficiências cromáticas
Teste acessibilidade de cores com simulação de daltonismo. Ferramenta gratuita para ver seu site através dos olhos de quem tem cegueira cromática.
Ler artigoWeb design responsivo com DevTools Device Mode
Web design responsivo com DevTools Device Mode do Chrome. Teste, debug e desenvolva sites mobile profissionais usando ferramentas nativas. Domine!
Ler artigoPré-processadores CSS e Chrome DevTools
Aprenda a usar pré-processadores CSS no Chrome DevTools. Debug e edição de Sass/LESS diretamente no navegador com source maps. Acelere o workflow!
Ler artigoGenymotion: emulador de Android
Genymotion: o melhor emulador Android para desenvolvimento profissional. Extremamente rápido, confiável e essencial para testes mobile. Experimente!
Ler artigoGulp Fiction
Gulp Fiction: automação front-end de forma criativa e eficiente. Técnicas avançadas, plugins essenciais e workflows para projetos modernos. Automatize!
Ler artigoGulp
Gulp: automatize tarefas de desenvolvimento front-end. Configure build, minificação, otimização de assets e workflow eficiente com JavaScript. Automatize!
Ler artigoUIkit: framework front-end modular responsivo
UIkit: framework front-end modular e responsivo profissional. Alternativa leve ao Bootstrap com componentes elegantes para desenvolvimento ágil. Use!
Ler artigoBower: gerenciador de pacotes front-end
Automatize o gerenciamento de dependências front-end com Bower. Instale, atualize e organize bibliotecas JavaScript de forma simples e eficiente.
Ler artigoGrunt: build tool para projetos front-end
Grunt: build tool essencial para automação front-end. Configure tarefas, minifique assets e otimize seu workflow de desenvolvimento. Automatize!
Ler artigoComo fazer fork de um projeto no GitHub
Tutorial completo sobre como fazer fork de projetos no GitHub corretamente. Aprenda comandos Git e fluxo ideal para contribuir com open source. Contribua!
Ler artigoComeçando com Git
Introdução completa ao Git para iniciantes. Aprenda controle de versão, comandos essenciais e por que Git revolucionou o desenvolvimento colaborativo.
Ler artigoUsando Modernizr para detectar features de HTML5 e CSS3
Modernizr: detecte features HTML5 e CSS3 no navegador facilmente. Biblioteca essencial para feature detection e progressive enhancement moderno. Use!
Ler artigoMelhores editores WYSIWYG
Compare os 10 melhores editores WYSIWYG para web: TinyMCE, CKEditor, Quill e Editor.js. Escolha o rich text editor ideal para seu projeto. Experimente!
Ler artigoFerramentas e recursos para desenvolvimento web
Ferramentas essenciais para desenvolvimento web profissional. Recursos, bibliotecas e utilidades práticas para aumentar produtividade e qualidade de código!
Ler artigoFerramentas gratuitas para testes de segurança em sites
Ferramentas gratuitas para testes de segurança em sites e aplicações. Proteja seus projetos web com scanners, validators e recursos de auditoria. Proteja-se!
Ler artigoRecursos de usabilidade grátis
Descubra recursos essenciais sobre usabilidade web grátis. Ferramentas, artigos, livros e referências completas para aprender e aplicar UX design!
Ler artigo7 ferramentas para web designs melhores
Analise e melhore seus web designs com ferramentas essenciais. Descubra heat maps, testes A/B, análise de usabilidade e otimização de conversão.
Ler artigoComo tirar screenshot de um web site inteiro e obter uma imagem completa
Aprenda 4 métodos práticos para capturar screenshot de sites completos, incluindo partes abaixo da dobra. Ferramentas e extensões testadas. Capture!
Ler artigoIdentificador de fontes
Ferramentas essenciais para identificar fontes de imagens e sites. Descubra tipografias desconhecidas facilmente com recursos online e extensões. Identifique!
Ler artigo