Como adicionar linhas de grade personalizadas a qualquer site no Chrome

A Apple pode estar desmoronando em termos de design de hardware e software, mas no seu auge, nos ensinou como algo é bom se estiver alinhado corretamente. O ponto é que, quando as coisas se alinham perfeitamente, elas parecem melhores e isso vale para o design industrial e o design da web. Os designs de sites geralmente são criados no Photoshop, mas isso não significa que designers e desenvolvedores não mexam com a aparência de um site no navegador. É muito fácil mexer; tudo o que você precisa fazer é abrir o console de desenvolvimento da web que todos os principais navegadores possuem e adicionar preenchimento, alterar a cor do texto etc. Uma coisa que falta a todos esses consoles é uma ferramenta de alinhamento. Se o Chrome é o seu navegador preferido para o desenvolvimento, Baseliner é uma extensão que você precisa experimentar. Ele adiciona uma série de linhas horizontais à sua tela. Você tem total liberdade para definir o espaçamento entre essas linhas, bem como suas cores. Além disso, a ferramenta permite adicionar preenchimento personalizado à parte superior de uma página antes das linhas de grade.

Instale o Baseliner e clique no botão B que ele adiciona ao lado da barra de endereço. Um menu será aberto com opções para personalizar sua grade.

Por padrão, o preenchimento superior é definido como 0px, o espaçamento entre linhas é definido como 12px e as linhas são cinza com a opacidade definida como 100%. Para alterar um desses valores, clique dentro da caixa ao lado deles.

A caixa de cores fornece um seletor de cores padrão para alterar a cor das linhas de grade. Os valores de espaçamento, preenchimento e opacidade podem ser alterados digitando um número personalizado para cada parâmetro. Como alternativa, você pode usar as setas para cima / para baixo para aumentar ou diminuir o valor. Depois de personalizar a grade, clique em "Aplicar" na parte inferior.

As linhas de cintura são adicionadas apenas à página atual e não a todas as páginas que você abriu no seu navegador. Para remover as linhas assim que terminar, clique no botão B novamente e clique no botão "Remover" na parte inferior.

O Baseliner funciona perfeitamente. O controle de cores da grade e o preenchimento na parte superior tornam a extensão ainda mais inteligente. Desejamos apenas que ele também suporte linhas verticais.

Instale o Baseliner na Chrome Web Store