Codificador/Decodificador URL

Convierte texto a formato seguro para URL o decodifica URLs con percent-encoding.

Abrir herramienta Volver a las herramientas
// about

Sobre esta herramienta

Las direcciones web no pueden tener espacios ni símbolos especiales. Esta herramienta convierte caracteres a un formato web seguro (símbolos %) y descifra URLs codificadas a texto normal.

Cómo usarla

  1. Pega el enlace web o texto que quieras convertir.
  2. Elige 'Codificar' o 'Decodificar'.
  3. Haz clic en 'Ejecutar' y copia tu URL lista.

Por qué usar esta herramienta

  • Corrige enlaces rotos que contienen espacios o caracteres especiales.
  • Descifra direcciones web confusas para ver su texto real.
  • Conversión instantánea desde tu navegador.

Preguntas frecuentes (FAQ)

¿Por qué las URLs tienen símbolos como %20?

Los navegadores reemplazan los espacios por %20 para interpretar bien la dirección.

¿Cuándo debo codificar una URL?

Siempre que los parámetros de tu enlace incluyan espacios o caracteres no ingleses.

¿Es gratis esta herramienta?

Sí, es 100% gratuita y sin límites de uso.

Guías · Codificación · 10 min de lectura

La codificación Base64 explicada: cómo funciona, dónde se usa y mitos comunes

Los adjuntos de correo, las data URI de imágenes y los tokens JWT dependen de Base64. Esta guía explica exactamente qué hace Base64, por qué el resultado es más largo que el original y cuándo conviene usarlo y cuándo no.

Todos los datos de un ordenador son, en última instancia, bytes. Sin embargo, muchos canales solo transportan texto de forma segura: cuerpos de correo, cabeceras HTTP, documentos JSON y URL. Si se envían por ellos bytes de imagen en bruto o texto cifrado, los caracteres de control y los saltos de línea pueden corromper los datos, o un sistema intermedio puede reescribirlos.

Man   → TWFu
Hi    → SGk=
한    → 7ZWc
안녕  → 7JWI64WV
Aprende cómo Base64 convierte 3 bytes en 4 caracteres, qué significa el = final, en qué se diferencia Base64URL y por qué Base64 no es cifrado.
Leer guía →

Guías relacionadas

Codificación 8 min de lectura

Guía de codificación URL (codificación por porcentaje): por qué el texto se convierte en %20 y %C3%B1

Qué caracteres admite una URL, cómo funciona la codificación por porcentaje, espacios como %20 o + y cómo evitar la doble codificación.

Leer guía
QR y códigos de barras 8 min de lectura

Cómo crear códigos QR que se escaneen: niveles de corrección de errores, tamaño de impresión y códigos de barras

Cómo funcionan los códigos QR, nivel de corrección (L, M, Q, H), tamaño de impresión y zona de silencio, fallos de lectura y códigos de barras.

Leer guía
Créalo con IA

Crea esta herramienta tú mismo con IA

¿Quieres tu propia versión? Copia el prompt en un chat de IA o guarda el archivo de skill para un agente de programación. Incluyen las funciones, casos límite y pruebas que usamos al crearla.

El prompt y la skill están en inglés, que las herramientas de IA entienden perfectamente.

Prompt de instrucciones para IA

Pégalo tal cual en Claude, ChatGPT o Gemini.

You are an experienced full-stack web developer. Build a web tool called "Codificador/Decodificador URL" that meets the requirements below.

## Goal

Build a tool that percent-encodes and decodes whole URLs or individual query parameter values.

## Core features

- Encode and decode modes
- Component mode (encodeURIComponent) or full-URL mode (encodeURI)
- Option to write spaces as %20 or +
- Break a query string into a key/value table
- Copy result

## Inputs

- A URL or a value to encode
- Mode and space-style option

## Outputs

- Encoded or decoded result
- List of query parameters with decoded values

## Edge cases and handling rules

- Warn when double encoding such as %2520 is detected
- Keep malformed sequences (%G1, trailing %) and show a warning instead of crashing
- Let the user decide whether + means a space
- Handle byte sequences that are not valid UTF-8

## Implementation requirements

- Build it as a single page (HTML, CSS, JavaScript) that runs entirely in the browser, and never send the user's input to a server.
- Make the UI responsive and easy to use on mobile; label every input and keep everything keyboard accessible.
- Add a Copy button for results and show clear, friendly error messages for invalid input.
- Keep the core logic in functions separate from the UI so it can be unit-tested.

## Definition of done (test cases)

- Component-encoding 'a b&c=d' gives 'a%20b%26c%3Dd'
- '안녕' gives '%EC%95%88%EB%85%95'
- Full-URL mode keeps :, /, ? and = in 'https://x.com/a?q=1'

First outline your implementation plan in at most five lines, then write the complete code, and finally explain how to check the test cases above.

Skill (SKILL.md)

Guárdalo como .claude/skills/build-url-codec/SKILL.md para que agentes como Claude Code lo reutilicen cada vez que crees o cambies la herramienta.

---
name: build-url-codec
description: Use when building or changing a Codificador/Decodificador URL tool. Build a tool that percent-encodes and decodes whole URLs or individual query parameter values.
---

# Build: Codificador/Decodificador URL

## Goal

Build a tool that percent-encodes and decodes whole URLs or individual query parameter values.

## Workflow

1. Review the required features, inputs and outputs below and ask about anything missing first.
2. Implement the core logic as pure functions separate from the UI.
3. Check the logic against the test cases in the verification list.
4. Build a responsive UI with an input form, a result area and a Copy button.
5. Reproduce each edge case listed under Rules and refine the error messages.

## Core features

- Encode and decode modes
- Component mode (encodeURIComponent) or full-URL mode (encodeURI)
- Option to write spaces as %20 or +
- Break a query string into a key/value table
- Copy result

## Inputs

- A URL or a value to encode
- Mode and space-style option

## Outputs

- Encoded or decoded result
- List of query parameters with decoded values

## Rules

- Warn when double encoding such as %2520 is detected
- Keep malformed sequences (%G1, trailing %) and show a warning instead of crashing
- Let the user decide whether + means a space
- Handle byte sequences that are not valid UTF-8
- Build it as a single page (HTML, CSS, JavaScript) that runs entirely in the browser, and never send the user's input to a server.

## Verification

- [ ] Component-encoding 'a b&c=d' gives 'a%20b%26c%3Dd'
- [ ] '안녕' gives '%EC%95%88%EB%85%95'
- [ ] Full-URL mode keeps :, /, ? and = in 'https://x.com/a?q=1'

Consejos para trabajar con IA

  • Indica tu stack (React, Vue o HTML puro) en la primera línea para obtener código adecuado.
  • Pide que ejecute las pruebas listadas y muestre los resultados antes de aceptar el código.
  • No pegues contraseñas reales, datos de clientes ni claves de API; usa valores de ejemplo.