Tutorial:Formas de Grid ♥

owo¡ me confundi de titulo en la imagen >w<¡ wa era formas de Grid pero bueno despues lo areglo ,aqui les dejare el tutorial en que formas lo pueden tener el circle grid era en forma de circulo ahora les traigo de diferentes formas que pueden hacerlo

Vista Previa 

Elije la forma que desees :3

Forma cuadrada 

si lo quieren asi 

Solo ve a los siguientes tutoriales :

Tutorial circle grid tipo 1 part1
Tutorial circle grid tipo 1 part2
Tutorial circle grid tipo 1 part3
Tutorial circle grid tipo 1 part4
Elije uno el que te guste y buscas en los codigos :

border-radius: 50%;

Borras todos los que encontraste y ya lo tendras en forma cuadrada

Forma 1

Como dije ve a uno de esos tutoriales y buscas el codigo 

border-radius: 50%;

50:Disminuyes a 30 y lo veras como la imagen :3 ,puedes aumentar el numero o disminuir el numero

FORMA 2

Como dije ve a uno de esos tutoriales y buscas el codigo 

border-radius: 50%;

En todos los que encontraste ese codigo lo remplazas por el siguiente:

border-bottom-right-radius: 80px 55px;
border-top-right-radius: 80px 55px;

80:Aumenta el numero y se pondra mas rendondeada la esquina inferior derecha

80:Aumenta el numero y se pondra mas redondeada la esquina superior derecha

55:Aumenta el numero y se curvara un poco en las esquina
Si quieres que se rendondee la esquina izquierda solo cambia del codigo :
right a left

FORMA 3

Como dije ve a uno de esos tutoriales y buscas el codigo 

border-radius: 50%;

En todos los que encontraste ese codigo lo remplazas por el siguiente:

border-bottom-left-radius: 80px 100px;
border-top-right-radius: 100px 100px;
border-top-left-radius: 80px 55px;

80:Aumenta el numero y se pondra mas rendondeada la esquina inferior izquierda

80:Aumenta el numero y se pondra mas redondeada la esquina superior izquierda

100:Aumenta el numero y se pondra mas rendodeada la esquina superior derecha

55:Aumenta el numero y se curvara un poco en las esquina
Si no te gusta las curvas puedes eliminar
100px  y 55px
Si quieres que se rendondee la esquina izquierda solo cambia del codigo :
right a left

FORMA 4

Como dije ve a uno de esos tutoriales y buscas el codigo 

border-radius: 50%;

En todos los que encontraste ese codigo lo remplazas por el siguiente:

border-bottom-left-radius: 80px;
border-top-right-radius: 100px;

80:Aumenta el numero y se pondra mas rendondeada la esquina inferior izquierda

100:Aumenta el numero y se pondra mas rendodeada la esquina superior derecha

Si quieres que se rendondee la esquina izquierda solo cambia del codigo :
right a left

Listo espero que les haya gustado :3