Rojo, blanco, azul: ocho reglas para elegir una paleta de colores que todo el mundo debería conocer. Cómo crear rápidamente una paleta de colores: un truco sencillo

Este artículo está dedicado a cómo obtener un conjunto de muestras de tonos de color de una imagen específica para crear su propia colección del esquema de color requerido. Teniendo en cuenta que muchos usuarios de Photoshop tienen que trabajar con diferentes clientes y cada uno de ellos prefiere un diseño determinado en tonos de color específicos, este artículo le ayudará a crear su propio conjunto de colores de forma bastante fácil y rápida.

Un ejemplo de imagen para una futura paleta de colores.

Nada puede combinar los colores tan armoniosamente como la naturaleza. En cualquier época del año, diversos paisajes están llenos de los matices más singulares que no todo el mundo podrá transmitir. Por lo tanto, para crear su propia paleta de colores, puede utilizar una fotografía normal de un paisaje y tomar muestras de color de ella. Esta lección también proporcionará instrucciones paso a paso sobre cómo restaurar el conjunto estándar de colores predeterminados y cómo aplicar la paleta creada con tonos preseleccionados.

10 pasos para crear tu propio set con los tonos de color que necesitas

En primer lugar, debe decidir la foto de la que desea tomar las sombras y luego iniciar Photoshop.

Panel de muestras

Es necesario borrar el conjunto de colores estándar presentado en el panel Muestras para que puedas crear fácilmente tu propia paleta. Sin embargo, no hay motivo para dudar, ya que el conjunto eliminado se puede devolver fácilmente. El área que nos interesa con muestras se encuentra junto a los paneles "Color" y "Estilos".

Para eliminar un conjunto, deberá trabajar con cada muestra por separado; el programa no tiene la función "borrar todas las muestras". Por lo tanto, para eliminar un color, es necesario presionar el botón Alt (Win) u Opción (Mac) y, con el cursor del mouse sobre él, eliminarlo con un simple clic. Hay 122 muestras en total, tendrás que hacer clic la misma cantidad de veces. En última instancia, después de la operación, el panel debería permanecer vacío.

herramienta cuentagotas

Primero, carguemos una imagen preseleccionada de la cual decidimos tomar los tonos de color. A continuación, regrese al panel de trabajo y seleccione la herramienta Cuentagotas. Existe una forma más rápida de llegar a este elemento: basta con pulsar la tecla I.

Primera muestra de color tomada de la imagen.

Tan pronto como seleccione el cuentagotas, mueva el cursor del mouse al elemento de la imagen del cual necesita una muestra de color y haga clic en esta área. El color seleccionado se muestra en la barra de herramientas, por lo que puedes ver exactamente qué tono se obtiene y será considerado el principal.

Cabe señalar que para simplificar el procedimiento de selección de color, puede mantener presionado el botón izquierdo del mouse y mover suavemente el cursor sobre el área de la imagen. Cuando pasa el cursor, puede ver cada color individual en la barra de herramientas, lo que le brinda la oportunidad de observar más de cerca un tono de color antes de seleccionar el que desea. Tan pronto como encuentre el color requerido, suelte el botón del mouse.

Seleccionar el color deseado para la paleta usando una pipeta.

Agregar color al panel Muestras

En esta etapa, habiendo recibido la primera muestra de color, se debe colocar en el panel “Muestras”. Para hacer esto, mueva el cursor a un área vacía dentro del panel con sombras futuras, como resultado de lo cual tomará la forma de un cubo de pintura y, al hacer clic, el color previamente seleccionado se convertirá en una muestra. Después de esta operación, el programa mostrará un cuadro de diálogo donde deberá ingresar un nombre para el color resultante. En principio no es necesario introducir el nombre, ya que el propio programa los instala por defecto. Después de nombrar un color, aparece inmediatamente en el panel Muestras.

Creando un conjunto con tonos de color.

Para reunir la paleta completa de colores necesarios, debes repetir los pasos anteriores varias veces:

Seleccione el color deseado y haga clic en el área vacía en el panel de muestras;

Guardamos el color como muestra, dándole un nombre si es necesario.

La cantidad de muestras guardadas puede ser ilimitada, todo depende de tu deseo. Al final, tras estos pasos, se montará sobre el panel con muestras un juego con las tonalidades de color necesarias.

Nueva paleta lista

Guardar muestras en un conjunto separado

Una vez añadidos los colores requeridos, se debe guardar el conjunto resultante para poder utilizarlo en el futuro. Para hacer esto, haga clic en el botón en la esquina superior derecha ubicado en el panel de muestras para ir al menú contextual, donde de la lista de comandos presentada debe seleccionar el elemento "Guardar muestras". Al guardar, deberá darle un nombre al conjunto. Tras estos pasos, el conjunto se guardará en la misma carpeta que los demás creados por defecto, lo que hace mucho más fácil encontrar el conjunto en caso de ser necesario.

Restaurar muestras de color predeterminadas

Si necesita volver a la paleta estándar de tonos de color después de haber borrado todos los colores, regrese al menú contextual del panel con muestras y seleccione el comando "Restaurar muestras". En el cuadro de diálogo que aparece, el programa le preguntará si desea reemplazar el conjunto actual por uno estándar. Aquí puede reemplazar tonos de color o simplemente agregarlos a las muestras actuales sin eliminarlas. Con este sencillo método puedes restaurar el conjunto estándar con muestras de color.

Cargando un conjunto de colores

Volvemos al conjunto de muestras creado para ver cómo aplicar los colores especificados. Para hacer esto, debe volver al menú del panel Muestras. En su parte inferior hay una lista de conjuntos con muestras que también se pueden utilizar, ya que originalmente estaban incluidos en el programa. Dado que todos los conjuntos nuevos creados se guardan en el mismo lugar que las muestras estándar, en esta lista se puede encontrar fácilmente un conjunto de tonos creado previamente. Todos los conjuntos del programa están ordenados alfabéticamente, lo que simplifica enormemente la búsqueda. Después de esto, aparecerá nuevamente un cuadro de diálogo pidiéndole que reemplace las muestras existentes por otras nuevas. En este caso, haga clic en el botón con el comando "Reemplazar". La paleta de colores seleccionada se cargará inmediatamente en el panel de trabajo y se podrán utilizar muestras de colores.

Paletas y muestras de colores.

Seleccionar un color de primer plano en el panel Muestras

Lo principal positivo de utilizar muestras de color es que no es necesario consultar periódicamente la paleta de colores especificada por el programa para encontrar el color correcto. Después de todo, todos se muestran en el panel con muestras, lo que hace que sea muy conveniente encontrar el color deseado. Para seleccionar un tono específico, simplemente coloque el cursor del mouse sobre él, que inmediatamente tomará la apariencia de un cuentagotas, y haga clic izquierdo. Se selecciona el color deseado. Aparecerá un icono con un color primario en el área de herramientas.

Configurando el fondo

Para establecer el fondo, debes decidir un color. Luego presione y mantenga presionada la tecla Ctrl (Win) o Comando (Mac) y haga clic en el color deseado en el panel. Como resultado, toda el área de trabajo del programa adquirirá un fondo. A continuación, puede utilizar todos los colores seleccionados de su propio conjunto a su discreción, todo depende de su imaginación. Con las herramientas de Photoshop, puede diseñar carteles en una combinación de colores específica.
Así, este artículo te permite crear tu propio conjunto con los tonos de color necesarios en Photoshop. Si sigue las instrucciones paso a paso proporcionadas, esta operación no le llevará demasiado tiempo.

Maqueta de producto utilizando una paleta de colores personalizada creada previamente

Hoy te mostraré cómo crear rápidamente una paleta de colores en Sketch. Este es un truco genial que él me enseñó. Marcos Edwards hace unos años.

Primero, creemos tres cuadrados con una longitud de lado que sea múltiplo de tres. En nuestro ejemplo, se trata de cuadrados de 240 puntos de alto y 240 puntos de ancho.

Cambiemos los nombres de estas capas a Rojo, Verde y Azul. Rellenemos la capa Roja con #FF6161, la capa Verde con #4F953B y la capa Azul con #0076FF. Seleccione estas capas y presione la tecla "A" para seleccionar la herramienta "Mesa de trabajo". Ahora seleccione la opción "Alrededor de la selección" en el panel "Inspector" a la derecha. Cambiemos el nombre de nuestra mesa de trabajo: llamémosla “Paleta de colores”.

Ahora añadiremos diferentes tonalidades a los cuadrados, dividiéndolos verticalmente en tres partes iguales. Para hacer esto, cree dos rectángulos encima de los cuadrados, del ancho de toda la mesa de trabajo. La altura de los rectángulos debe ser ⅓ de la altura de los cuadrados — es decir, en nuestro caso, 80pt.

Alinee un rectángulo con el borde superior de la mesa de trabajo y rellénelo de blanco, y el segundo con el borde inferior y rellénelo de negro. Ahora establece la opacidad de los rectángulos al 20%. Terminamos con tres tonos diferentes de rojo, verde y azul. Cambiemos el nombre de estas dos capas para no confundirnos más adelante.

Ahora dividiremos los cuadrados nuevamente — esta vez horizontalmente. Crea un rectángulo de la misma altura que el cuadrado. El ancho de este rectángulo es ⅓ del ancho del cuadrado mismo. Alinea el rectángulo con el centro del cuadrado rojo. Ahora dupliquemos este rectángulo y alineemos el nuevo rectángulo con el borde derecho del cuadrado rojo.

Ahora comienza la diversión. Rellena estas dos capas con algún color alegre. Usaremos amarillo (#FFE200). Establece la transparencia del rectángulo central al 40% y la de la derecha al 80%. Finalmente, cambie el modo de fusión a superponer.

Ahora necesitamos dividir el rectángulo principal en nueve partes iguales. Básicamente, puedes simplemente duplicar los dos últimos rectángulos verticales y moverlos a los cuadrados verde y azul para crear una paleta de colores completa.

resultado final

Cómo usar colores en Sketch

Sketch tiene una función oculta que puede ayudarle a identificar los colores utilizados con frecuencia en un documento. Esta característica se puede encontrar en el panel Inspector al seleccionar un color de relleno. A la derecha, justo encima del valor alfa, hay un cuadro de color. Cuando hacemos clic en esta ventana, se abre un panel que muestra los colores utilizados con frecuencia.

Guardar colores en Sketch es bastante fácil. Cuando selecciona un color, verá dos paneles: Colores globales y Colores del documento. Los colores comunes son colores que se guardan para todos los documentos. Los colores del documento aparecen sólo para el documento en el que está trabajando.

Consejo: Para seleccionar rápidamente un color, presione “Control + C” y haga clic en el color que desee. Esta es una tecla de acceso rápido para la herramienta Cuentagotas.

Complemento de paletas de bocetos

Cuando trabaja en un proyecto grande con muchos archivos, no es necesario crear manualmente los colores del documento.

Aquí es donde el complemento Sketch Palettes resulta útil. Le permite guardar paletas en un archivo, que luego puede importar a otro documento. De esta manera, puede agregar rápidamente colores de marca a cualquier documento nuevo.

En este tutorial, exploraremos cómo tomar muestras de tonos de color de una imagen y crear conjuntos a partir de ellos que podrás usar más adelante, especialmente cuando trabajas con diferentes clientes, cada uno de los cuales prefiere ciertos colores para su proyecto o cuando simplemente quieres Crea tu propia colección de tonos de color.

Una de mis actividades favoritas es fotografiar paisajes y luego guardar los colores individuales de las fotografías como conjuntos de colores. Después de todo, es casi imposible vencer a la Madre Naturaleza cuando se trata de combinaciones de colores armoniosas. En este tutorial haremos todo exactamente como lo acabo de describir: tomar muestras de color de una foto, colocarlas en el selector de color y luego guardarlas como un conjunto separado de muestras de color. ¡También veremos cómo restaurar los colores predeterminados originales del programa cuando hayamos terminado y cómo cargar el conjunto creado cuando lo necesitemos!

A continuación se muestra una foto de la que tomaré tonos de color individuales. Quiero crear un conjunto de muestras de color llamado "Hojas de otoño", así que esta foto sería perfecta:

Imagen del colorido follaje de otoño

Al final del tutorial, veremos un ejemplo de cómo puedes usar los colores del conjunto que creamos para crear una apariencia completamente diferente. Empecemos.

Paso 1: eliminar los tonos de color existentes del panel Muestras

Para crear su propio conjunto de tintes de color, primero eliminemos todas las muestras de tintes de color presentadas en el panel Muestras. No te preocupes, no se eliminarán permanentemente, como veremos más adelante. Cambie al panel Muestras, que de forma predeterminada está agrupado junto con los paneles Color y Estilos. A menos que haya cargado previamente otros conjuntos de colores, el panel Muestras mostrará los colores que se configuraron originalmente en el programa de forma predeterminada:

El panel Muestras muestra una selección de muestras de color predeterminadas

Desafortunadamente, el programa Photoshop No existe el comando Eliminar todas las muestras de color, por lo que para eliminar todas las muestras de color que se muestran en el panel Muestras, necesitaremos eliminar cada muestra de color manualmente. Para hacer esto, mantenga presionada la tecla Alt (Win) / Opción (Mac) y coloque el cursor sobre la muestra de color en la esquina superior izquierda (“RGB rojo”). Verás como el cursor tomará forma de tijera:

Tecla Alt presionada(Ganar)/Opción(Mac) Pase el mouse sobre la muestra de color rojo en la esquina superior izquierda. Cursorratonesenesteaceptaráformatijeras

Luego, manteniendo presionada la tecla Alt/Opción, haga clic en la muestra de color para eliminarla. Continúe haciendo clic en otras muestras de color para eliminarlas. Deberá hacer clic en el botón del mouse un total de 122 veces para eliminar todas las muestras, pero dependiendo de qué tan rápido haga clic en el botón del mouse, esto no le llevará mucho tiempo. Cuando haya terminado de eliminar muestras de colores, su panel Muestras estará completamente vacío:

Después de eliminar todas las muestras de color predeterminadas, el panel Muestras está vacío

Paso 2: seleccione la herramienta Cuentagotas

Abra la imagen en Photoshop donde desea tomar una muestra del color (si aún no está abierta), luego seleccione la herramienta Cuentagotas en el panel Herramientas o presione I para una selección rápida de herramientas:

Elegirherramienta « Pipeta»

Paso 3: obtenga la primera muestra de color de la imagen

Después de seleccionar la herramienta Cuentagotas, mueva el mouse sobre el área donde desea probar el color y luego haga clic para probar el color. Quiero probar el color amarillo brillante de una de las hojas en la parte superior de mi imagen como primer color de mi conjunto futuro:

Toma una muestra de color amarillo brillante de una de las hojas.

Puedes saber exactamente qué color obtuviste de una imagen mirando el ícono de muestra de color primario en la barra de herramientas:

El color resultante se muestra en la barra de herramientas como color primario.

Nota: Puede que le resulte más fácil recopilar colores manteniendo presionado el botón del mouse mientras mueve el cursor dentro de la imagen (con la herramienta Cuentagotas seleccionada). El color en el que se posa el cursor aparecerá en la barra de herramientas como color base y cambiará continuamente a medida que mueva el mouse, brindándole una vista previa del color antes de muestrearlo. Este método me parece más conveniente que el método de hacer clic con el botón del mouse y solo entonces ver qué muestra recibimos. Suelte el botón del mouse cuando encuentre un color que se adapte a su conjunto de muestras de color.

Paso 4: agregue color al panel de muestras

Una vez que haya muestreado su primer color, mueva el cursor del mouse a un área vacía dentro del panel Muestras. Verá que el cursor cambia a la forma de un cubo de pintura. Haga clic en cualquier parte del área vacía para convertir el color resultante en una muestra de color. Esta acción abrirá un cuadro de diálogo que le pedirá que ingrese un nombre para su muestra de color. Si está creando un conjunto de muestras de color para un cliente que usa y, por lo tanto, requiere colores Pantone específicos, podría ser una buena idea nombrar su muestra de color con un color que coincida con la carta de colores Pantone (por ejemplo, Pantone Yellow 012 C). Si está creando un conjunto de muestras de color para su propio uso, asigne a la muestra el nombre que elija. Llamaré a mi muestra de color "Amarillo":

Dale a tu nueva muestra de color un nombre significativo o puedes optar por no ponerle ningún nombre.

De hecho, no es necesario nombrar las muestras de color, por lo que si los nombres de las muestras no te importan, entonces deja los nombres que el programa ofrece por defecto. Haga clic en Aceptar para cerrar el cuadro de diálogo una vez que le haya dado un nombre a la muestra de color. Si miro el panel Muestras ahora, puedo ver que mi primera muestra de color se agregó allí:

Mi muestra de color Amarillo creada aparece en el panel Muestras.

Paso 5: continúe recopilando colores y cree muestras de color a partir de ellos.

Continúe recopilando colores de su imagen y luego haga clic en un área vacía del panel Muestras para guardarlas como muestras de color, dándoles nombres si es necesario. Reuní 10 colores más de la imagen y terminé con 11 muestras nuevas en el panel Muestras. Puedes crear tantas muestras de color como quieras:

Paso 6: guarde las muestras de color como un conjunto separado

Cuando haya terminado de agregar colores al panel Muestras y esté listo para guardarlos como un conjunto de muestras separado, haga clic en la pequeña flecha hacia la derecha en la esquina superior derecha del panel Muestras para abrir el menú del panel:

Haga clic en la pequeña flecha hacia la derecha para abrir el menú del panel Muestras

Luego, en el menú que aparece, seleccione "Guardar muestras":

Introduzca un nombre para el nuevo conjunto de muestras.

A continuación, haga clic en el botón "Guardar" » (Guardar) para guardar un conjunto de muestras. El programa guardará la muestra de color configurada en la misma ubicación que los otros conjuntos de muestras cargados en el programa de forma predeterminada, por lo que no tendrá que buscar en toda su computadora la carpeta correcta la próxima vez que desee acceder a cualquiera de las conjuntos de muestras creados, que consideramos más a fondo.

Paso 7: restaurar muestras de color predeterminadas

Tomamos algunos colores de una imagen, creamos muestras de color a partir de ellos y las guardamos como un nuevo conjunto de muestras separado. Pero ¿qué pasa si queremos reutilizar las muestras de color predeterminadas que eliminamos al principio del tutorial? Todo lo que tenemos que hacer es hacer clic nuevamente en la pequeña flecha hacia la derecha en la esquina superior derecha del panel Muestras para abrir nuevamente el menú del panel y seleccionar el comando Restaurar muestras de la lista que aparece. » ( Restablecer muestras):

Para devolver las muestras de color predeterminadas al panel, seleccione el comando "Restaurar muestras"

En el cuadro de diálogo correspondiente, el programa le preguntará si necesita reemplazar las muestras de color actuales por las predeterminadas. Puede confirmar que desea reemplazar las muestras de color actuales con las predeterminadas haciendo clic en Aceptar, o puede agregar las muestras predeterminadas a las muestras actuales sin eliminarlas haciendo clic en el botón Agregar. Haré clic en Aceptar y reemplazaré mi conjunto de muestras de Hojas de Otoño con las muestras de color predeterminadas:

Haga clic en Aceptar para restaurar muestras de color predeterminadas

Después de esta acción, las muestras de color predeterminadas volvieron a aparecer en el panel Muestras:

Las muestras de color predeterminadas están de vuelta en el panel Muestras

Paso 8: cargue su propio conjunto de muestras de color

La próxima vez que desee utilizar el conjunto de muestras de color que creó, todo lo que tiene que hacer es hacer clic nuevamente en la flecha derecha para abrir el menú del panel Muestras. Si miras la parte inferior del menú, verás una lista de conjuntos de muestras de colores adicionales que están actualmente disponibles para descargar. La mayoría de estos kits vienen con Photoshop listo para usar, pero como nuestro kit de muestras se guarda en el mismo lugar que los otros kits, también podrá verlo en la lista de kits. Sólo necesitas hacer clic en el nombre de tu conjunto para seleccionarlo. El programa coloca conjuntos de muestras de color en orden alfabético, por lo que mi conjunto Hojas de otoño ocupa el segundo lugar desde arriba:

Encontrarás todos los conjuntos de muestras de color, incluido el tuyo, en el menú del panel Muestras. Hacer clicenNombrereclutamientoParasuelección

Una vez más, el programa le preguntará si desea reemplazar los conjuntos existentes por otros nuevos o agregar nuevas muestras de color a las muestras que ya se encuentran en el panel. Haré clic en Aceptar para reemplazar las muestras predeterminadas con las muestras creadas del conjunto Hojas de otoño:

Haga clic en el botón Reemplazar para reemplazar las muestras predeterminadas en el panel con nuevas muestras de color.

Esta acción cargará mis nuevas muestras de color del conjunto Hojas de otoño en el panel Muestras, listas para su uso posterior:

Mi propio conjunto de muestras de color cargadas en el panel Muestras

Paso 9: seleccione un nuevo color primario en el panel de muestras

La gran ventaja de utilizar muestras de color es que son colores preestablecidos. Esto significa que estos son los colores que ya hemos elegido (o los colores que el programa ha elegido por nosotros, si está trabajando con las muestras predeterminadas), y no tenemos que seleccionar esos colores desde el selector de color cada vez. los necesitamos. Para seleccionar cualquiera de los colores en el panel Muestras, simplemente coloque el mouse sobre la muestra de color deseada. Verá que el cursor cambia a la forma de un cuentagotas. Después de eso, haga clic en el color para seleccionarlo. En mi caso elegiré el color naranja, el segundo desde la izquierda:

Para seleccionar el color que desea, haga clic en su muestra en el panel Muestras.

Después de hacer clic en el color deseado, puede ver que este color fue seleccionado por nosotros y se mostró en el ícono de muestra de color primario en la barra de herramientas:

El color en el que hizo clic en el panel Muestras aparece en el icono de muestra de color principal en la barra de herramientas

Paso 10: seleccione un nuevo color de fondo en el panel de muestras

Para seleccionar un color específico como color de fondo, mantenga presionado Control(Ganar) / Dominio(Mac) y al mismo tiempo haga clic en el color deseado en el panel Muestras. En mi caso, cuando se presiona la tecla Control/Dominio Haré clic en el color rojo oscuro:

Con la tecla Ctrl presionada(Ganar)/Comando(Mac) Haga clic en el color que desee en el panel Muestras para convertirlo en su color de fondo.

Ahora, si miro la barra de herramientas nuevamente, puedo ver que el ícono de muestra de color de fondo ahora tiene el color rojo oscuro que acabo de seleccionar:

El color que seleccionó en el panel Muestras aparece en el icono de muestra de color de fondo en la barra de herramientas.

¡Ahora puedo usar los colores de mi set Autumn Leaves como quiera y cuando quiera! A continuación se muestran las líneas del poema que diseñé usando colores de mi conjunto de muestras de color creado y el pincel de Hojas de arce dispersas predeterminado en Photoshop:

Poema usando colores de mi conjunto de muestras de colores Autumn Leaves que creé.

¡Y ahora hemos terminado! ¡Hemos aprendido cómo crear fácilmente tus propias muestras de color y conjuntos completos de muestras en Photoshop!

Traducción: Ksenia Rudenko

El diseño de un sitio web eficaz es impensable sin elegir una combinación de colores. Queda por descubrir cómo hacer esto.

Para algunos proyectos, es posible que ya haya elegido algunos colores que combinen con su logotipo o paleta de marca y esté construyendo su sitio dentro de esas limitaciones. Otros son todavía sólo bocetos. También están aquellos que necesitan cambios menores que puedan hacer que el sitio sea más hermoso y conveniente.

Ya sea que esté buscando una manera de hacer su trabajo más fácil y rápido o esté creando un sitio web por primera vez, estas herramientas lo ayudarán a encontrar una solución.

Comencemos con una breve introducción a la teoría del color.

A continuación encontrará 19 recursos que le ayudarán a elegir una paleta de colores para su sitio web.

Preparación

¿Necesitas algo de inspiración?

1.

BrandColors muestra cómo las marcas líderes utilizan el color para diferenciar sus negocios, contar sus historias y comunicar sus valores. Puede ver una lista de empresas, organizaciones sin fines de lucro y nuevas empresas en orden alfabético, o buscar una marca que le interese.

¿Buscas una paleta ya preparada?

2.

Este es un foro de diseño de paleta de colores con casi 2.000.000 de opciones enviadas por los usuarios. Puede descargar una paleta que contiene un color específico y leer lo que escriben los diseñadores. Como regla general, para una combinación se dan varias opciones de diferente intensidad.

La paleta va acompañada de nombres reveladores: Tormenta en las Whitsundays (archipiélago del Pacífico en el Mar del Coral), Crepúsculo en las Whitsundays, Isla Whitsunday

3.

Este recurso permite a los usuarios crear y cargar sus propios esquemas de color. Puedes filtrarlos por fecha, calificación y número de descargas, o buscar por palabras clave.

4.

En ColoRotate, encontrará una biblioteca de combinaciones de colores que puede explorar, seleccionar y cambiar. Una herramienta de color 3D especial te ayudará a crear tu propia paleta basada en la que encontraste. La combinación de colores que cree se puede aplicar inmediatamente en PhotoShop o Fireworks instalando el complemento ColorRotate o la aplicación para iPad.

Según los requisitos de la marca.

¿Qué sucede si ya tiene imágenes, logotipos o requisitos de marca que deben cumplirse?

1.

Este sitio no tiene tantas funciones como algunos de esta lista, pero hace un gran trabajo en lo que fue diseñado: investigar un color específico. Simplemente cargue una imagen y Color Hunter creará una paleta basada en ella. Esta es una excelente manera de lograr la armonía entre las imágenes y los colores principales del sitio. Además, aquí puedes diseñar la combinación de colores del sitio que más te guste.

2.

Pictaculous crea paletas a partir de fotografías. Todo lo que tienes que hacer es subir una foto para obtener los colores que la acompañan. El recurso también ofrecerá paletas confeccionadas que se adaptarán a sus necesidades.

3.

Esta herramienta se conocía como Adobe Kuler y estaba destinada a la comparación de colores. Ahora es un sistema completo de creación de paletas que le permite probar, comparar y guardar combinaciones de colores. Puede seleccionar el tipo de paleta y crear combinaciones de cinco colores automáticamente o utilizando la configuración manual.

4.

Paletton acelera el proceso de creación de paletas. Debe elegir el tipo de esquema: mono, compuesto, tríada, tétrada, relacionado, contraste relacionado. Una vez que cambies un color, los demás se ajustarán automáticamente.

5.

Color Spire también construye una paleta basada en un solo color. Tú eliges el tono original y obtienes opciones de esquemas que combinan con él. También puedes ver una vista previa de cómo se ve la paleta seleccionada en el sitio web.

6.

Este complemento de Chrome le ayuda a armonizar los colores, adaptarse al daltonismo e identificar códigos HEX. Las paletas de colores se pueden exportar directamente a Illustrator, PhotoShop y CoIRD.com.

7.

El recurso le permite manipular su propia paleta de colores seleccionando y agregando tonos. Como resultado, podrá crear rápida y fácilmente un nuevo diagrama basado en uno existente.

8.

Esta herramienta selecciona colores que coinciden con los suyos. Es un poco más básico que los otros recursos de esta lista. Debe insertar el código HEX del color en la línea o seleccionarlo del espectro presentado en forma de rueda. El generador produce 3 colores que coinciden con los tuyos y les proporciona códigos HEX.

Crea tu propio color

Muchos de los recursos de esta lista suponen que tienes el color original. Si no es necesario cumplir con los requisitos de la marca y BrandColors no ayudó con la elección, puede comenzar con bocetos.

1.

Esta aplicación para iOS te ayuda a elegir entre varios colores que se colocan uno al lado del otro a una distancia corta, lo cual es mucho más conveniente que la representación de degradados, círculos y espectros. Las grandes cuadrículas de colores le permiten utilizar toda la pantalla (lo cual es especialmente valioso para los propietarios de iPad Pro). En la aplicación, puede crear muestras de color, buscar valores RGB, HEX y HSLA y crear paletas a partir de bocetos.

3. Color

En Color de HailPixel, no puedes evitar decidirte por un color. Comprenderá exactamente lo que desea y recibirá el código HEX para la cortina.

Mueves el mouse o haces un gesto y el color cambia un poco cada vez. Parece una esfera de color, acompañando constantemente los colores con códigos HEX. Si te mueves hacia la izquierda y hacia la derecha en la pantalla, el color cambiará y hacia arriba y hacia abajo, la saturación cambiará.

Obtener código de color

Si viste un color en alguna parte y quieres saber su código y nombre, estos recursos son para ti.

1.

SpyColor proporcionará información sobre cualquier color, incluidos Hex, RGB, CMYK y otros códigos, y mostrará una variedad de patrones para cada tono, incluidos complementarios, complementarios divididos, de proceso, de contraste y analógicos.

2.

Códigos de color HTML encuentra el código HEX para los colores de una imagen. Selecciona una imagen, la abre para verla y obtiene el código de color al pasar el cursor sobre ella.

Prueba tu paleta

Una vez que haya creado una combinación de colores, querrá asegurarse de que sea efectiva.

Check my Colors compara los colores de primer plano y de fondo con los requisitos de contraste para aquellos con una visión anormal de los colores. Si desea asegurarse de que su sitio sea apto para daltónicos o desea obtener combinaciones de colores que funcionen y sean intuitivas desde una perspectiva de UX, este recurso es indispensable. Basta con introducir la dirección del sitio web para familiarizarse con el informe por su apariencia.

Aquí puedes elegir hasta 5 tonos de una paleta enorme y obtener imágenes que tienen una combinación de colores similar y van acompañadas de códigos HEX. Las imágenes se pueden guardar en el sitio web o descargar.

Conclusión

Crear una paleta de colores para un sitio web es un oficio en la intersección del arte y la ciencia. Estos recursos lo ayudarán a obtener rápida y fácilmente una experiencia visual que se ve excelente y funciona bien.

A la hora de crear un diseño web, quizás lo más importante sea la posibilidad de elegir los colores adecuados. Esto puede resultar difícil y, en ocasiones, llevar mucho tiempo, por eso hoy hemos preparado una pequeña selección de recursos que te facilitarán esta tarea.

una pequeña teoría

Los colores para la web se realizan mediante combinaciones de rojo, verde y azul, este método de combinación de colores se llama RGB (Red Green Blue).

Cada color está representado por un número entero de 0 a 255 y cada color tiene un valor para rojo, verde y azul. El negro, por ejemplo, no tiene tono y en RGB se designa como 0, 0, 0. El primer número siempre significa el valor del rojo, el segundo, el verde y el tercero, el azul.

Dado que existen 256 variedades de cada tono, existen 16 millones de combinaciones de colores RGB posibles. La mayoría de las computadoras actuales pueden mostrar con precisión los 16 millones de colores. Existen los llamados "colores seguros"; ya hemos escrito sobre la necesidad de utilizarlos.

Al especificar un color, puede utilizar el valor RGB o el sistema hexadecimal HEX. Los colores HEX están representados por seis dígitos precedidos por un signo #. HEX consta de una combinación de números y letras; 0 es el valor más pequeño, FF (255) es el más alto. Cada uno de estos seis caracteres en HEX corresponde a números en codificación RGB. El color negro tiene el valor HEX #000000.

147 colores están definidos por nombre para HTML y CSS según w3schools.com. Hay 17 colores estándar: agua, negro, azul, fucsia, gris, verde, lima, burdeos oscuro (granate), azul oscuro (azul marino), oliva (oliva), violeta (púrpura), rojo (rojo), plateado. (plateado), azul verdoso (verde azulado), blanco (blanco) y amarillo (amarillo). Cada color tiene su propio valor RGB y HEX específico. El burdeos oscuro, por ejemplo, tiene un valor RGB de 128, 0, 0 y un valor HEX de #800000; para plata: 192, 192, 192 o #C0C0C0.

Creando una paleta

A veces crear una paleta parece más fácil de lo que realmente es. Algunos diseñadores experimentados pueden crear una paleta desde cero; otros se inspiran en otros sitios o fuentes externas (mirando los colores de una bolsa de patatas fritas en la ferretería o encontrando las soluciones adecuadas en la naturaleza).

Las paletas se diseñan de diversas formas, según el proceso de pensamiento del diseñador. Algunas personas tienen un ojo tan agudo que pueden igualar colores sobre la marcha mientras hojean un libro de colores o miran una fotografía. Al crear una paleta, asegúrese de realizar combinaciones de colores para cada elemento de su sitio web.

Para usar colores que encontró en otros lugares, tome una fotografía digital y ábrala en un editor de gráficos, como Adobe Photoshop. Acérquese hasta que los píxeles sean claramente visibles y use la herramienta Cuentagotas para seleccionar los tonos que desee, luego escriba sus valores.

Recursos útiles

No es necesario reinventar la rueda. Existen muchas herramientas en línea gratuitas que permiten a los usuarios crear, descargar e importar paletas de colores en cuestión de minutos. Las paletas se pueden crear basándose en un solo color o utilizando una fotografía u otra imagen. A continuación se muestran algunos servicios sencillos para este propósito.

Una herramienta para crear una paleta de seis colores, que los diseñadores pueden descargar en formato .atc para Photoshop, .epc para Illustrator o enviar por correo electrónico. Establezca el tono para cada color usando el control deslizante o especifique su valor usted mismo.

Disponemos de una gran biblioteca de combinaciones de colores listas para usar de cinco sistemas de colores. Puede utilizar la herramienta Cuentagotas para definir un color. Hay muchas posibilidades (ver colores junto con texto, generar plantillas de sitios web con colores seleccionados, etc.). Con este servicio también puedes determinar los colores del sitio web que te gusta (simplemente ingresa su URL).

Generador de paleta de colores

Comentarios

1. serg
   24 de febrero de 2012 a las 21:33

   Excelente y útil colección. Por mi parte, puedo mencionar colourschemedesigner.com, que, entre otras cosas, tiene varios modos de presentación para personas con trastornos de percepción del color. Puedes comprobar, por ejemplo, cómo verán tu trabajo las personas con tritanopía)

2. Constantino
   25 de febrero de 2012 a las 8:47 am

   Un error tipográfico al principio - RGB (Leer Verde Azul) - Leer Verde Azul)))

   Elena17 Respuesta:
   25 de febrero de 2012 a las 15:30 horas

   Gracias;), ya lo solucioné.

3. irina
   25 de febrero de 2012 a las 22:55

   ¡A los creadores del sitio!

   Realmente amo su sitio y constantemente leo nuevas publicaciones.

   ¡Por alguna razón, recientemente Kaspersky (licencia) comenzó a insultar y bloquear su página!

   Llamo su atención sobre esto..

   Mi respuesta:
   26 de febrero de 2012 a las 19:51

   Gracias, lo resolveremos))

4. elena
   26 de febrero de 2012 a las 11:50