Imagen: Foto de Sigmund en Unsplash
Aquí tienes una lista de 6 herramientas online para generar o retocar CSS:
1. CSSmatic (https://www.cssmatic.com/)
– No requiere registro.
– Características: Generador de gradientes, sombras, bordes redondeados y efectos de texto. También ofrece una herramienta de recorte de imágenes y un generador de patrones.
2. CSS3 Generator (https://css3generator.com/)
– No requiere registro.
– Características: Genera código CSS para propiedades como bordes redondeados, sombras, gradientes, transformaciones y transiciones.
3. CSS Grid Generator (https://cssgrid-generator.netlify.app/)
– No requiere registro.
– Características: Permite generar diseños de rejilla utilizando la especificación CSS Grid. Proporciona opciones para configurar el número de columnas, el tamaño de las filas y columnas, y las brechas entre ellas.
4. ColorZilla (https://www.colorzilla.com/)
– No requiere registro, pero ofrece una versión Pro con características adicionales.
– Características: Incluye una herramienta de selección de colores con cuentagotas, generador de gradientes, analizador de colores de página, y generador de paletas de colores.
5. CSS Beautifier (https://www.freeformatter.com/css-beautifier.html)
– No requiere registro.
– Características: Formatea y reorganiza el código CSS para mejor legibilidad. Puede ser útil para dar formato a código CSS existente y hacerlo más estructurado.
6. CSS Minifier (https://cssminifier.com/)
– No requiere registro.
– Características: Minifica el código CSS, eliminando espacios en blanco y reduciendo el tamaño del archivo. Puede ser útil para optimizar la carga de páginas web al reducir el tamaño de los archivos CSS.
Estas herramientas online te permitirán generar y retocar CSS de manera fácil y rápida sin tener que instalar ningún software adicional.
Si queremos hacer que nuestra caja tenga los bordes redondeados, esta es tu página. Sólo tienes que indicar los pixeles que debe tener el redondeado. aplicar y copiar el código
Las urls cortas nacieron, entre otras cosas, para poder meter enlaces en los 140 caracteres de twitter sin que te quedarás sin espacio para poner nada más. Se siguen usando para abreviar pero no solo se usa con esta finalidad. Los ‘malos’ lo usan para enmascarar malware o redirigirte a webs falsas (phising), por lo que cada vez somos más reacios a clicar en una url acortada que no venga de una fuente de confianza, y aún así.
¿Alguna vez te has preguntado como ver la url final sintener que hacer click?
Si es así, tienes suerte, alguien ha pensado que este servicio podría ser útil y ha creado un servicio online para poder ver esa URL final.
El servicio se llama GetLinkInfo.com Esperamos a que su servicio de cloudflare verifique nuestro browser y accederemos a su landing. Simplemente entramos el link acortado que queremos verificar y pulsamos el botón verde de Get Link Info, en unso segundos nos proporcionará la dirección completa que hay escondida.
La próxima vez, antes de abrir una URL acortada, ya sabes lo que tienes que hacer.
Los códigos QR son códigos de puntos que, capturados por la cámara de tu teléfono móvil, normalmente te llevan a una Web, aunque se puede suar para muchas más cosas, como hacer una llamada, enviar un email, capturar texto, una Vcard, geolocalización, los datos de una wifi…
Hay muchas webs que te permiten generarlos de forma muy rápida y sencilla.
Esta web la he usado bastante. Te permite generar códigos para variedad de conceptos y escoger el tamaño (pequeño, mediano, grande y muy grande) y la redundancia. La redundancia es un factor que permite que el código QR sea leído incluso aunque tenga una parte de la imagen deteriorada. A mayor redundancia más posibilidades de que se pueda leer si se deteriora, pero la imagen es entonces,mayor.
Las pruebas realziadas con tamaño mediano y redundancia buena nos han dado buen resultado.
Puedes descargar el código con botón derecho sobre la imagen o copiar un código HTML para incrsutar en tu web.
Tienes más opcions aún que la anterior, aunque algunas son de pago como la descarga de Apps o archivos PDF
En la versión gratis permite mostrar el código en un marco. Para crear el código QR de tu web, tan simple como seleccionar la opción URL, pegarla en el campo que hay debajo de los iconos y se generará automáticamente a la derecha, donde podremos seleccionar el marco gratuito y pulsar el botón de DESCARGAR .JPG. (aunque lo descarga en .png). PAra descargarlo como vector es preciso registrarse.
Esta web permite en su versión gratuita,. cambiar el color del fondo y el color del código qr.
También tiene su versión de pago que permite generar códigos dinámicos, es decir, puedes generar un código QR y una vez publicado, puedes cambair el destino del código sin necesidad de volver a generar la imagen, incluso que sea válido entre unas fechas concretas.
Una vez creado lo puedes descargar en formato .png
En su versión gratuita permite descargar el código QR en varios formatos, resoluciones y color que puedes personalizar al dar la botón de descarga .
También puedes personalizar el código embedido para incrustarlo ent tu web o añadir el enlace en una mensaje o email.
bajo pago, puedes solicitar el código personalizado con tu logo, en alta claidad.
Esta web es muy útil si la URL que quieres compartir es de una red social, ya que puedes usar plantillas para direcciones de facebook, twitter, instagram, youtbe, etc… con el logo de la red social en el centro y del color carcaterísitco de las mismas.
PAra generar los cósifos en alta resolución debes registrate y comprar un plan, que este caso es anual, a diferemncia de los que habíamso visto hasta ahora que eran mensuales.
La descarga gratuita es una fichero comprimido con el código en png y png, así como thumbnails.
Los Favicon son las imágenes que acompañan al título de nuestra página web en las solapas del navegador. Debemos crear un favicon para nuestra web para que el usuario la reconzoca con facilidad entre las múltiples pestañas que pueda tener abiertas en us navegador. Tienen el formato .ico y unas medidas concretas.
En WordPress podemos añadirlo directamente desde el menú Apariencia -> Personalizar -> Ajustes generales -> Identidad del Sitio. Pero antes tenemos que crearlo. Para crear un favicon existen formas online de hacerlas, yo uso Favicon.ico & App Icon Generator. Esta web no solo te genera el favicon para web sino que también los genera para dispositivos móbiles (android e IOS de Apple).
Pero vamos a hablar de más opciones para crear favicon para nuestra web.
https://www.favicon-generator.org/
Es muy completo, crea favicon para la web y APPs de dispositivos móviles: Android,IOS (vale y para Windows Mobile también).
Sólo tienes que seleccionar la imagen de tu ordenador y clicar en CREATE FAVICON (crear favicon)
Lo puedes descargar en un zip y descomprimir en la raíz de tu sitio web
Para crear favicon con esta web debemos seguir los siguientes pasos:
1º Seleccionamos la imagen. Una vez cargada, nos la muestra en la parte superior derecha. Aquí podemos manipular que parte de la imagen queremos, moviendo el cuadro o haciéndolo más grande. La parte que esté dentro de la selección, será nuestro favicon.
2º Capturamos la sección que queremos y definimos su tamaño, por defecto hace la captura de 32×32, pero puede llegar a generarlo haste de 128×128 pixels.
3º En esta casilla veremos el resultado como quedaría en nuestra web
Esta web permitía crear favicon transparente y favicons animados. Pudiendo seleccionar las áreas transparentes.
La útlima vez que visité la web, no estaba operativa. La dejó aquí por si vuelve a estarlo, es una opción interesante
Esta sencilla página te permite subir una imagen y generar el favicon de la medida que quieras. Lo descargas y lo subes a tu web. Sencillo pero eficaz si solo necesitas el fichero .ico para tu wordpress.
Ya no tienes excusa para no crear un favicon para tu sitio web. Ponte Manos a la Web
