18 diciembre 2024

Rounded Cornr, generar esquinas redondeadas en imágenes y contenido

Rounded Cornr es un servicio que nos permite generar botones con esquinas redondeadaas, pero lo más importantes es que nos provee del código HTML/CSS necesario para colocar esquinas redondeadas alrededor del contenido de nuestro sitio web o blog.

Rounded Cornr

 

Existen tres formas de crear esquinas redondeadas para tu contenido.  La primera nos permite crear imágenes simples, la segunda imagenes con el efecto gradiente en sus colores y por último esquinas redondeadas con bordes.

Rounded Cornr

Una vez definidos los parámetros(color del fondo, color del box, ancho del borde, etc.) en cualquiera de las tres posibilidades, presionamos Generate RoundedCornr y pasamos automáticamente a la página que nos dá el código HTML, el código CSS y los enlaces para descargar las esquinas redondeadas generadas.

Aunque eso no es todo, por último tienen un generador de imágenes, a las cuáles les podemos incluir texto.  Ese generador nos dá todas las opciones anteriores, pero no nos da el HTML o el CSS, ya que lo que genera es una imagen, como por ejemplo la que generé a continuación:

Rounded Cornr

Este sitio para generar botones simples con esquinas redondeadas utiliza una técnica explicada en un artículo escrito por  Søren Madsen llamado CSS Design: Creating Custom Corners & BordersAquí pueden encontrar algo más sobre ese artículo y también otro autor llamado Ryan Trash creó la misma técnica en forma independiente.  Para crear un simple box se basan en el libro Web Design in a Nutshell de O’Reilly, esta técnica también está explicada por Adam Kalsey.  Por último, para generar los gradientes, solamente cambian los fondos de la imágenes.

Verdaderamente para los que trabajamos con código es un recurso interesante y que puede ser de gran ayuda.  Por seguro para tenerlo entre nuestros favoritos!

Enlace: Rounded Cornr

Siguenos por Twitter a través de @Geeksroom y no te pierdas todas las noticias, cursos gratuitos y demás artículos. También puedes seguirnos a través de nuestro canal de Youtube para ver nuestros vídeos, a través de Instagram para ver nuestras imágenes! O vía Bluesky si ya estás cansado de Twitter

Hector Russo

Desde su juventud se ha dedicado a la Tecnología de la Información. En su oportunidad fue incluido por Ivy Worldwide en su lista Top 25 influencers en Tecnología. Actualmente es miembro del panel de jurados que elige los mejores vehículos del año para el mercado hispano de Estados Unidos, a través de los Hispanic Motor Press Awards.

Ver todas las entradas de Hector Russo →

3 comentarios en «Rounded Cornr, generar esquinas redondeadas en imágenes y contenido»

  1. lo principal es que te da el codigo y todo, lo cual podes modificar a tu gusto.
    Saludos y gracias por tu comentario

    Hector

Los comentarios están cerrados.