Gerador de slug

Digite um título à esquerda e a versão pronta para URL aparece à direita. Letras acentuadas perdem o acento, pontuação e emoji somem, espaços viram hífens e o resultado é cortado no tamanho que você escolher. O contador embaixo dos painéis mostra quantos caracteres o slug tem.

Meus dados são enviados para algum lugar?

Não. A conversão inteira acontece no seu navegador, com operações comuns de texto. Nada do que você digita sai da página, então o título de um post ainda não publicado ou o nome interno de um projeto ficam tão privados aqui quanto no seu próprio editor.

Como as letras acentuadas são tratadas?

O modo padrão reduz tudo a ASCII. Ele usa String.prototype.normalize na forma NFKD, que separa uma letra como é em um e simples mais um acento solto, e depois apaga os acentos. Assim São Paulo vira sao-paulo e Coração vira coracao.

Algumas letras não se decompõem desse jeito, porque não são uma letra base com um sinal em cima. O ß do alemão é o caso que costuma pegar as pessoas de surpresa: o NFKD não mexe nele, então sem tratamento especial ele sumiria do slug. Esta ferramenta troca o ß por ss antes de tudo, junto com æ para ae, œ para oe, ø para o, đ e ð para d, ł para l e þ para th. Straße sai como strasse.

Uma escolha que vale explicar: ö vira o, e não oe. Em alemão oe seria a forma preferida, mas a mesma letra é uma vogal própria em sueco e finlandês, onde oe estaria errado. Como a ferramenta não sabe o idioma do seu texto, ela fica com a opção neutra.

Se você preferir manter as letras originais, mude a configuração de caracteres para o modo Unicode. Aí os acentos sobrevivem, e os alfabetos não latinos também, então 東京の天気 continua 東京の天気 em vez de virar uma string vazia. Navegadores e buscadores atuais lidam com essas URLs, embora elas fiquem feias quando copiadas em forma percent-encoded.

O que fazem as outras opções?

O separador pode ser hífen ou sublinhado. Dá para desligar a conversão para minúsculas se quiser manter as maiúsculas. “Juntar separadores repetidos” espreme sequências de separadores em um só, então olá --- mundo dá ola-mundo e não ola---mundo. “Remover separadores das pontas” tira os separadores do começo e do fim, que é o que limpa a sobra deixada por um ponto de interrogação final.

O tamanho máximo é um controle deslizante, e 0 significa sem limite. O corte cai em um separador, então nenhuma palavra é partida ao meio. Se uma única palavra for maior que o limite e não houver separador onde cortar, ela é cortada mesmo, porque a alternativa seria um slug vazio.

Onde isso aparece no dia a dia?

Definir a URL de um post, uma âncora de documentação, um nome de arquivo, uma classe CSS, uma chave de banco de dados ou o nome de um branch. Qualquer lugar em que um título feito para humanos precisa virar algo seguro dentro de um caminho.