Sitio sencillo estilo minimalista de 3 secciones con color en gradiante

Este es un sitio sencillo estilo minimalista con HTML y CSS. El sitio número 5 del reto personal #100sitioswebchallenge

Puedes visualizar el sitio en: Elements

DESAFÍOS

Con este sitio sencillo pude experimentar un poco con el uso de gradiantes com background utilizando dos diferentes maneras.

background-image: linear-gradient(to right, #F1521C , #F000F2);
background-image: linear-gradient(#F1521C, #F000F2);

PROCESO

Paleta de colores y estilos

Paleta de colores: F1521C F01D6F F000F2 FDEDE8

Tipografía:

Mockup (Bosquejo)

Este es el primer processo del sitio, bosquejado primero en la forma más simple y posteriormente agregando color y estilos.

HTML y CSS

Este es el proceso del sitio con el editor a un lado.

Este es el proceso del sitio primero maquetado con HTML

Este es el tercer paso terminando el sitio con estilos CSS

Sitio web final

Sitio web responsivo

Por último este es el sitio de manera responsiva

Publicación del sitio

Consulta el código del sitio en Github

Puedes visualizar el sitio en: Elements

Información técnica

  • Visual Studio Code
  • HTML5 (Semántico)
  • CSS
  • Sitio responsivo
  • Github
  • Netlify

Este fue un sitio minimalista sencillo de 3 secciones. Deja tus comentarios y sugerencias.

NEWSLETTER

Suscríbete a Sencillamente Web

Reflexiones sobre desarrollo web

Contenido Relacionado

Sitio Web de Boda – Dark Mode

Sitio Web de Boda – Dark Mode

Tabla de contenidos Introducción Proceso Paleta de colores y estilos HTML y CSS Sitio web responsivo Publicación del sitio Información técnica Recursos Introducción Este sitio estilo One Page está maquetado con HTML y estilizado con CSS, así como el uso de flexbox...

Sitio Web de Boda

Sitio Web de Boda

Tabla de contenidos Introducción Proceso Paleta de colores y estilos Bosquejo HTML y CSS Sitio web responsivo Publicación del sitio Información técnica Recursos Introducción Este sitio estilo One Page está maquetado con HTML y estilizado con CSS, así como el uso de...

Sitio de Vestido de Novias – Pink

Sitio de Vestido de Novias – Pink

Tabla de contenidos Introducción Proceso Paleta de colores y estilos HTML y CSS Sitio web responsivo Publicación del sitio Información técnica Recursos Introducción Este sitio estilo One Page está maquetado con HTML y estilizado con CSS, así como el uso de flexbox...