# Fondos aesthetic: cómo crear los tuyos [Canonical HTML page](https://gradiently.design/es/guide/aesthetic-backgrounds) Los fondos que se descargan los comparte todo el mundo que encontró la misma página. Crear los tuyos lleva una tarde, y el resultado combina con tu móvil, tu escritorio y tus publicaciones. ## The short version - Un fondo aesthetic suele ser un campo de color suave y de bajo contraste, con luz delicada y un poco de textura, y no una imagen recargada. - La mayoría de los looks aesthetic salen de una paleta estrecha: de tres a cinco colores cercanos en luminosidad, con un tono algo más profundo para dar fondo. - Un toque de grano hace que los degradados suaves parezcan película o papel y oculta las franjas que pueden mostrar los degradados lisos. - Crea un look y expórtalo para cada formato que uses, como un fondo de móvil de 1080 por 1920, un escritorio de 1920 por 1080 y una publicación de 1080 por 1350. - Deja la zona más tranquila del fondo donde vayan a ir los relojes, los iconos o las palabras. Un **fondo aesthetic** es, en la práctica, un campo de color suave con luz delicada y un poco de textura: una bruma de melocotón, una mañana de salvia, un crepúsculo de lavanda, un marrón oscuro como de película. Para crear el tuyo, elige de tres a cinco colores cercanos en luminosidad, mézclalos con suavidad bajo una única luz delicada, añade un toque de grano y exporta el mismo look para cada pantalla y formato que uses. El resultado se siente tranquilo, personal y coherente, que es casi todo lo que la gente quiere decir con aesthetic. Esta guía te da paletas listas con códigos, el método para crear las tuyas y un conjunto de tamaños para que tu móvil, tu escritorio y tus publicaciones combinen. Para el razonamiento de color que hay detrás, mira los [degradados pastel](https://gradiently.design/es/guide/pastel-gradients) y [los fundamentos de la teoría del color](https://gradiently.design/es/guide/color-theory-basics). ## Qué hace que un fondo parezca aesthetic Fíjate bien en los fondos que la gente guarda y comparte y verás que se repiten los mismos rasgos. Ninguno tiene que ver con un color concreto: tienen que ver con la contención. - **Bajo contraste.** Los colores están cerca en luminosidad, así que nada salta a la vista. - **Transiciones suaves.** Las mezclas son largas y graduales, sin bordes duros. - **Una fuente de luz.** Una zona es un poco más brillante, como la luz de una ventana, y da profundidad al campo. - **Textura.** El grano fino o el relieve del papel le da un aire físico y no digital. - **Espacio.** No hay nada que mirar, y eso es justo lo que lo hace bueno detrás de iconos, palabras y fotos. - Bruma de melocotón: `linear-gradient(160deg, #fde2d4 0%, #f9c6c9 50%, #e8c5e5 100%)` - Mañana de salvia: `linear-gradient(180deg, #eef2e6 0%, #cfdcc4 55%, #a9bfa3 100%)` - Crepúsculo lavanda: `linear-gradient(165deg, #e9e4ff 0%, #c9bdf2 50%, #9d8fd9 100%)` - Luz de mantequilla: `radial-gradient(circle at 30% 20%, #fff6d6 0%, #fbe3a4 45%, #f2c78b 100%)` - Azul nube: `linear-gradient(180deg, #f3f7ff 0%, #d7e6fb 50%, #b9cfee 100%)` - Rosa bailarina: `linear-gradient(180deg, #fff0f3 0%, #fbd3dc 55%, #f2aebf 100%)` - Dark academia: `linear-gradient(170deg, #4a3b33 0%, #2e241f 55%, #171210 100%)` - Película de medianoche: `radial-gradient(ellipse at 70% 20%, #3a3560 0%, #1c1a33 50%, #0d0c18 100%)` Ocho fondos aesthetic como degradados CSS sueltos. Cada uno mantiene sus colores cerca en luminosidad, y eso es lo que los hace tranquilos. Los aesthetic claros y oscuros siguen las mismas reglas a la inversa. Los claros mantienen todos los colores pálidos y dejan que un tono algo más profundo se acumule en un borde. Los oscuros mantienen todo profundo y dejan que una sola mancha más cálida o más brillante haga de luz, como una lámpara en una habitación en penumbra. Los fondos oscuros necesitan aún más grano, porque el banding se nota sobre todo en las sombras; los [fondos de degradado oscuro](https://gradiently.design/es/guide/dark-gradient-backgrounds) profundizan en ello. ## Cómo crear tu propio fondo aesthetic 1. **Elige una palabra de ambiente** Una o dos palabras: *domingo lento*, *mañana junto al mar*, *biblioteca antigua*. Los ambientes llevan a paletas con más fiabilidad que los nombres de colores. 2. **Reúne de tres a cinco colores** Toma las muestras de una foto que tenga ese ambiente, o constrúyelos a mano. Mantenlos cerca en luminosidad, con un tono algo más profundo. [Sacar una paleta de una foto](https://gradiently.design/es/guide/color-palette-from-image) te muestra cómo. 3. **Elige la dirección de la luz** Decide de dónde viene la luz, normalmente de arriba o de una esquina superior. Pon ahí el color más claro y deja que el resto se aleje de él. 4. **Mezcla con suavidad** Usa transiciones largas con las paradas bien separadas, o unas pocas manchas radiales superpuestas para un campo más suave, como una nube. Evita las paradas bruscas. 5. **Añade grano** Un poco de ruido sobre toda la imagen. Lo justo para notarlo, no tanto como para verlo a distancia de brazo. Los [degradados con grano](https://gradiently.design/es/guide/grainy-gradients) explican por qué funciona. 6. **Exporta para cada formato** Dibuja el look en cada tamaño que necesites, en lugar de recortar una sola imagen, para que la luz se quede en su sitio. - Lino: #fbe9dd - Leche de albaricoque: #f4d3c2 - Arcilla rosa: #e9bfb4 - Malva empolvado: #d7b8c9 - Fondo: sombra de ciruela: #a88ca6 Una paleta trabajada para un ambiente de *domingo lento*: cuatro tonos cálidos y cercanos y una ciruela más profunda que da fondo en los bordes. > **Por qué los fondos suaves muestran franjas** Los degradados suaves con colores cercanos son justo donde las pantallas muestran franjas, sobre todo en tonos oscuros e imágenes comprimidas. El grano las oculta. Si ves bandas, lee sobre el [banding en degradados](https://gradiently.design/es/guide/gradient-banding). ## Fondos aesthetic para móvil, escritorio y publicaciones La gracia de crear los tuyos es que todo puede combinar. Crea un look y expórtalo para cada lugar donde vive. Los móviles son los más altos: muchas pantallas modernas son más altas que 9:16, así que exporta un fondo de móvil con altura extra, o comprueba el tamaño exacto de tu pantalla, como se explica en [el tamaño de los fondos de pantalla de móvil](https://gradiently.design/es/guide/phone-wallpaper-size). - Fondo de móvil 1080×1920: 1080 × 1920 - Escritorio 1920×1080: 1920 × 1080 - Publicación 1080×1350: 1080 × 1350 - Cuadrado 1080×1080: 1080 × 1080 Un aesthetic, cuatro exportaciones. Coloca la luz para cada formato en lugar de recortar una sola imagen. Cada formato tiene sus propias zonas ocupadas. En la pantalla de bloqueo de un móvil, el reloj está cerca de la parte superior y las notificaciones en el centro. En un escritorio, los iconos suelen bordear un lateral. En una publicación, las palabras necesitan una zona tranquila. Mueve la fuente de luz para que la parte más calmada del campo quede bajo esos elementos. Una publicación vertical con un título corto sobre un fondo degradado suave y cálido Una publicación con el aesthetic: las palabras están en la zona tranquila de arriba. Una historia vertical con una cita corta sobre el mismo degradado suave que la publicación El mismo look como historia, dibujado para el formato más alto y no recortado. ## Cómo evitar que parezca genérico Los degradados pastel suaves son populares, lo que significa que los valores por defecto están por todas partes. Unas pocas decisiones pequeñas hacen que el tuyo sea reconocible como tuyo. ### Genérico - Un preajuste de dos colores de un generador - Perfectamente liso, sin textura - Iluminado por igual de una esquina a otra - Un look distinto para móvil, escritorio y publicaciones ### Tuyo - Cuatro o cinco colores de tu propio ambiente - Grano fino, como película o papel - Una fuente de luz clara - Un solo look dibujado para cada formato Si prefieres partir de algo ya trabajado, el Mercado de Gradiently tiene miles de Marks, fondos de degradado vivos con color, material, luz, grano y movimiento, que puedes buscar con palabras de color como «melocotón suave» o «verde azulado profundo» y con los que puedes diseñar gratis. Después, el estudio puede maquetar el mismo look para tu móvil, tu escritorio y tus publicaciones. ## FAQ ### ¿Qué hace que un fondo sea aesthetic? Normalmente una paleta suave y de bajo contraste, transiciones delicadas, una sola fuente de luz y un poco de textura, como el grano. Lo que da el look es la contención, no un color concreto. ### ¿Cómo hago un fondo de pantalla aesthetic para mi móvil? Elige de tres a cinco colores cercanos, mézclalos con suavidad con la luz cerca de la parte superior, añade grano fino y exporta en un tamaño alto, con altura extra para móviles más altos que 9:16. ### ¿Qué colores son aesthetic? Cualquiera puede serlo, si están cerca entre sí en luminosidad y saturación. Entre las familias populares están el melocotón y el rosa, la salvia y la crema, la lavanda y el azul grisáceo, y los marrones profundos para ambientes más oscuros. ### ¿Por qué mi fondo suave tiene franjas? Los degradados lisos entre colores cercanos muestran banding en muchas pantallas, sobre todo tras la compresión. Añadir grano fino y exportar en alta calidad suele ocultarlo.