PIP Tools - Ferramentas flutuantes com PIP! Transforme o navegador em um paraíso da multitarefa!
(pip-tools.com)Apresentando!
Apresentamos uma coleção de ferramentas criada com o recurso Picture-in-Picture do navegador.
Por que foi criado?
Eu uso um seletor de cores de vez em quando, mas não queria instalar um app separado só para isso. No caso dos seletores de cores disponíveis na web, às vezes era necessário mover a janela (ou aba) do navegador, o que era inconveniente.
Quais recursos ele tem?
Relógio: exibe a hora atual
Timer: cronômetro de contagem regressiva
Seletor de cores: extrai e copia códigos de cor
Redimensionamento de imagem: ajusta o tamanho de imagens
Tradutor: tradução multilíngue (usando a API de tradução do Chrome)
Notas: anotações simples em texto
Roleta: jogo de seleção aleatória
Que recursos serão adicionados no futuro?
Estão planejados calculadora, conversor de unidades, scripter, marca-d'água em imagens e outros.
Além disso, se houver alguma ferramenta de que você precise, envie sua opinião pelo contact no canto inferior esquerdo. Farei o possível para refletir isso ativamente.
Stack técnica
Next.js
React
TypeScript
react-document-pip
13 comentários
Opa~! É uma ótima ideia.
Parece que primeiro é preciso acessar pelo navegador. Também pensei que seria bom se desse para manter sempre aberto. Mesmo assim, já está muito bom. Gostei demais do timer e do extrator de cores.^^
Obrigado. Para mim, a ferramenta de que mais gosto também é o extrator de cores!
Estou usando o Firefox e aparece uma mensagem dizendo que o PIP não é compatível. Sendo que eu usava bem o recurso de PIP ao assistir YouTube.
Usa uma API do navegador chamada Document Picture in Picture, diferente do PIP de imagens e vídeos.
Como ainda é um recurso experimental, pode não funcionar em alguns navegadores T_T
Você pode verificar os navegadores compatíveis em https://caniuse.com/mdn-api_documentpictureinpicture !
Uau, isso é incrível.
Obrigado!
Nossa, sensacional;;; eu não sabia que o PiP não servia só para assistir vídeos, mas que também permitia vários tipos de interação!
Como ainda é um recurso experimental, muita gente ainda não conhece!
https://developer.mozilla.org/en-US/docs/…
As notas também são ótimas! Obrigado
Obrigado!
Se precisarem de mais ferramentas, deixem suas sugestões!
Uau, que ideia boa!
Obrigado~!