How to make the Flag of Europe in Excel

This article shows how to make the Flag of Europe in Excel respecting their colors and shapes.

The heraldic description shows:

On an azure field a circle of twelve golden mullets, their points not touching.

Regulation colors of the European flag are two:
- PANTONE REFLEX BLUE for the surface of the rectangle and
- PANTONE YELLOW for the stars.

Color	Denominación color	HTML	RGB
Yellow	Pantone Reflex Blue	#FFCC00	255/204/0
Blue	Pantone Yellow	#003399	0/51/153

A little more complex is to help users to correctly reproduce the graphical construction of the European emblem since it must draw on a background of blue sky, twelve golden stars form a circle representing the union of the peoples of Europe. The stars are fixed, twelve being the symbol of perfection and unity.

The task to design the flag in Excel as its geometric description is divided to represent:

- One of the 5-pointed star.

- The stars are upright, with the one point vertical and two points in a straight line at right angles to the mast.

- The blue rectangular flag whose length equals 3/2 of the width.

- The 12 gold stars equidistant in a circle whose center is at the point of intersection of the diagonals of the rectangle.

- The radius of the circle is equal to 1/3 of the width of the flag.

- The stars are part of a circle whose radius is equal to 1/18 the width of the flag.

- The arrangement of the stars corresponds to the position of the hours in the face of a clock.

The next video shows how to make in 3 minutes the European flag in Excel:





The 5-pointed stars with 10 vertices and values 1 and 0.4 for each vertice respectively.

To distribute the stars in an imaginary circle the following table applies approximately:

Star X Y 1 9.00 2.00 2 11.00 2.50 3 12.50 4.00 4 13.00 6.00 5 12.50 8.00 6 11.00 9.50 7 9.00 10.00 8 7.00 9.50 9 5.50 8.00 10 5.00 6.00 11 5.50 4.00 12 7.00 2.50
	In a Cartesian coordinate system xy, the circle with center at point (h, k) and radius r consists of all points (x, y) which satisfy the equation: being in this case: h = 9, k = 6 y r = 4.

Spreadsheet with the exact position of the 12 stars here:



Spreadsheet with the exact position of the 5 points stars here:



One of the most common mistakes often include more than 12 stars because of the impression that each star represents a state. The remaining errors are due to not following the principles of the European Union.


In the Army:
- Soldier!, Let's hoist the flag!
- Well made, host sir.

Traducción al español aquí.

Cómo hacer la bandera de Europa en Excel

Para hacer la bandera de Europa en Excel se deben respetar sus colores y sus formas.

La descripción heráldica la muestra:

Sobre campo azur, un círculo formado por doce estrellas de oro, cuyas puntas no se tocan entre sí.

Los colores reglamentarios de la bandera europea son dos:
- el PANTONE REFLEX BLUE para la superficie del rectángulo y
- el PANTONE YELLOW para las estrellas.

Color	Denominación color	HTML	RGB
Amarillo	Pantone Reflex Blue	#FFCC00	255/204/0
Azul	Pantone Yellow	#003399	0/51/153

Un poco más complejo es ayudar a los usuarios a reproducir correctamente la construcción gráfica del emblema europeo ya que se deben dibujar, sobre un fondo de cielo azul, doce estrellas doradas formando un círculo, que representa la unión de los pueblos de Europa. Las estrellas son invariablemente doce, símbolo de perfección y unidad.

La tarea para diseñar la bandera en Excel según su descripción geométrica se divide en representar:

- Una de las estrellas de 5 puntas.

- Las estrellas están en posición vertical, con una punta dirigida hacia arriba y otras dos sobre una línea recta imaginaria, perpendicular al asta de la bandera.

- La bandera rectangular de color azul, cuya longitud equivale a 3/2 de su anchura.

- Las 12 estrellas doradas equidistantes formando un círculo imaginario cuyo centro se sitúa en el punto de intersección de las diagonales del rectángulo.

- El radio del círculo equivale a 1/3 de la anchura de la bandera.

- Las estrellas se inscriben en un círculo imaginario cuyo radio equivale a un 1/18 de la anchura de la bandera.

- La disposición de las estrellas se corresponde con la de las horas en la esfera de un reloj.

En el siguiente vídeo muestro cómo hacer en 3 minutos la bandera de Europa en Excel:





Las estrellas de 5 puntas tienen 10 vértices con valores 1 y 0,4 para cada punta respectivamente.

Para distribuir las estrellas en un círculo imaginario se aplica la siguiente tabla aproximada:

Star X Y 1 9,00 2,00 2 11,00 2,50 3 12,50 4,00 4 13,00 6,00 5 12,50 8,00 6 11,00 9,50 7 9,00 10,00 8 7,00 9,50 9 5,50 8,00 10 5,00 6,00 11 5,50 4,00 12 7,00 2,50
	En un sistema de coordenadas cartesianas x-y, la circunferencia con centro en el punto (h, k) y radio r consta de todos los puntos (x, y) que satisfacen la ecuación: siendo en este caso: h = 9, k = 6 y r = 4.

Hoja de cálculo con la posición exacta de las 12 estrellas aquí:



Hoja de cálculo con la posición exacta de las estrellas de 5 puntas aquí:



Uno de los errores más frecuentes suele ser incluir más de 12 estrellas, debido a la impresión de que cada estrella representa a un Estado. El resto de errores se debe a no seguir los principios mencionados por la Unión Europea.

En la mili:
- Soldado!, hize la bandera!
- Pues le ha quedado muy bonita, mi sargento.

English translation of this post here.

How to make the Flag of Spain in Excel

Following one of the examples shown in the previous article Color's chart, it is very easy to create the Flag of Spain in Excel, how difficult is to choose a good color palette, because it is officially allowed a range for red and yellow flag colors.

30 years ago the Spanish Constitution was unaware of the Internet, created in the last 20 years, long remained a communication system used exclusively by the military of the U.S. Department of Defense - DoD, the CERN laboratory and universities. The web as we know it is used worldwide from April 30, 1993.

The first Web surfers had limited resources with the first browsers, which is resented in its design and aesthetics. With the new user-friendly browsers, not only for the military or research fields, the green "phosphors" text of old CRT, or white on black background, became full of the colors and interactivity of current web.

Above you can see running an embedded image in animated GIF format that can have an idea of the possibilities that allow user-centered design with today's media.

The following video show how to make in 2 minutes the flag of Spain in Excel:





The most important thing is to convert the 4 series into equal 3 horizontal stripes, giving format to the data series, selecting into Series option, the width range to 0% (no interval).

The color's issue is another story. Due to the tolerance of 5 CIELAB units, as permitted by the Spanish authorities, the choice of colors is having complications. According to the Wikipedia article on the Flag of Spain, its colors with CIE (Illuminant C) in HTML are:

Color	Color Name	Y	x	y	HTML	RGB
Yellow	Flag Weld-Yellow	56.7	0.488	0.469	#F1BF00	241/191/0
Red	Flag Red	9.5	0.614	0.320	#AA151B	170/21/27

But the color palette should be as follows, see the technical specifications with a tolerance of 5 CIELAB units:

Color	Color Name	Tone H en º	Croma C	Lightness L	HTML Range	RGB Range
Yellow	Flag Weld-Yellow	85.0	95.0	80.0	#F0AD00 - #FFC900	240/173/0 - 255/201/0
Red	Flag Red	35.0	70.0	37.0	#A00011 - #C02226	160/0/17 - 192/34/38

As I said, a color conversion program, such as The Coloring Pages, will help us to transform their values in different metrics. Below is the conversion of CIE values (Illuminant C) to RGB for red and yellow colors:

Therefore, next HTML and RGB values would be appropriate:

Color	Color name	Y	x	y	HTML	RGB
Yellow	Flag Weld-Yellow	56.7	0.488	0.469	#FFB300	255/179/0
Red	Flag Red	9.5	0.614	0.320	#A80C1B	168/12/27

Graphic designers and user-centered design application developers should not stop doing our work when it comes to something as important as choosing the right color palette for a corporate graphic image or any other type and we must always ensure that we are following the original technical specifications of the projects we are up to make.

Do you know the flags' colors of your country?

Traducción al español aquí.

Cómo hacer la bandera de España en Excel

Continuando con uno de los ejemplos mostrados en el artículo anterior Colores a la carta, es muy fácil crear la bandera española en Excel, lo difícil es elegir una buena paleta de colores, porque oficialmente está permitido un rango de colores para el rojo y el amarillo de la bandera.

Hace 30 años la Constitución Española no sabía de Internet, creada en los últimos 20 años, siendo durante mucho tiempo un sistema de comunicación utilizado exclusivamente por los militares del Departamento de Defensa americano - DoD, el laboratorio CERN y por los universitarios. La web tal y como la conocemos es utilizada en el mundo desde el 30 de abril de 1993.

Los primeros navegantes de la red tenían recursos limitados con los primeros navegadores, lo que se resentía en su diseño y estética. Con los nuevos navegadores amigables para el usuario ("user friendly"), y no sólo para el campo militar o de investigación, se transformó el texto verde "fosforito" de las antiguas pantallas CRT, o de color blanco sobre fondo negro, en la web actual, hecha de colores e interactividad.

Arriba se puede ver en funcionamiento una imagen incrustada en formato GIF animado que puede hacernos una idea de las posibilidades que permite el diseño orientado al usuario con los medios actuales.

En el siguiente vídeo muestro cómo hacer en 2 minutos la bandera de España en Excel:

Lo más importante es convertir las 4 series iguales en las 3 franjas horizontales, dándole formato a las series de datos eligiendo, en Opciones de serie, el Ancho de intervalo del 0% (Sin intervalo).

El asunto de los colores es otro cantar. Debido a la tolerancia de 5 unidades CIELAB, permitida por las autoridades españolas, la elección de los colores se complica. Según el artículo de Wikipedia sobre la Bandera de España, sus colores CIE con Iluminante C en HTML son:

Color	Denominación color	Y	x	y	HTML	RGB
Amarillo	Amarillo gualda bandera	56.7	0.488	0.469	#F1BF00	241/191/0
Rojo	Rojo bandera	9.5	0.614	0.320	#AA151B	170/21/27

Pero la paleta de colores debería ser la siguiente, viendo sus especificaciones técnicas con una tolerancia de 5 unidades CIELAB:

Color	Denominación color	Tono H en º	Croma C	Claridad L	Rango HTML	Rango RGB
Amarillo	Amarillo gualda bandera	85.0	95.0	80.0	#F0AD00 - #FFC900	240/173/0 - 255/201/0
Rojo	Rojo bandera	35.0	70.0	37.0	#A00011 - #C02226	160/0/17 - 192/34/38

Como ya comenté, un programa de conversión de colores, como The Coloring Pages, nos ayudará a transformar sus valores en diferentes métricas. A continuación se muestra la conversión de los valores CIE (Iluminante C) a RGB para los colores rojo y amarillo:

Por ello, los valores HTML y RGB adecuados serían:

Color	Denominación color	Y	x	y	HTML	RGB
Amarillo	Amarillo gualda bandera	56.7	0.488	0.469	#FFB300	255/179/0
Rojo	Rojo bandera	9.5	0.614	0.320	#A80C1B	168/12/27

Los diseñadores gráficos y los programadores de aplicaciones de diseño orientado al usuario no debemos dejar de hacer nuestro trabajo cuando se trata de algo tan importante como elegir la paleta adecuada de colores de una imagen gráfica corporativa o de cualquier otra índole y siempre debemos respetar las especificaciones técnicas originales del proyecto que tengamos entre manos.

¿Conoces los colores de las banderas de tu país?

English translation of this post here.

Color's chart

Users perceive colors by the sense of sight and you can't believe your eyes, can you?

In a modern monitor, LCD or LED type, the images are formed by the additive mixture from the basic colors Red (R), Green (G) and Blue (B), so technically known as the RGB color model.

The cone cells in our eyes are sensitive to colors. There are three specialized types in each of the basic colors. The green and red are seen with the same intensity, but the blue is perceived as one twentieth (1/20), wich allows the compression of images and videos in JPEG and MPEG formats, reducing the blue component without appreciating a substantial loss quality. But everything depends on having the sense of sight as much or little developed as those good painters, for whom this loss is important. The opposite occurs in those with color blindness and in severe cases come to confuse red and green, although they can see more shades of purple that people with normal vision and are able to distinguish some hidden objects.

The levels of RGB for each color grade ranging from minimum 0 to maximum brightness level of 255, so a single point of light can be altered by 16,777,216 (256x256x256) different values of RGB, from (0,0,0) to (255,255,255), which is sufficient for 24-bit monitors, but they tend to be 32 bits, up to 4,294,967,296 colors (although usually 8 bits per RGB value and 8 bit alpha transparency, depending on the graphics card . To do this using other color models such as CMYK (for its initials in English Cyan Magenta Yellow blacK) with different color depths. The colors of the web pages as you're seeing now are generated using HTML color codes representing their respective RGB values.

In short, that "nothing is truth, nothing is lie, it all depends on the eye of the beholder", but what is not acceptable is that the professionals of user-centered design use a non-standard and variable color palette and not follow the technical and legal requirements officially established. And it occurs more often than it should be by negligence or by the damn hurry.

As a little colorful exercise, I'm attaching three Excel sheets with the flags of India, Spain and Europe, with the official colors of their respective countries:




The Royal Decree 441/1981 of 27 February, technically specifies the colors of the Spanish Flag:

Color	Color Name	Tone ºH	Croma C	Lightness L
Yellow	Flag Weld-Yellow	85.0	95.0	80.0
Red	Flag Red	35.0	70.0	37.0

And it also indicates a tolerance of 5 CIELAB units, so the Spanish Flag is made of more than two colors, as many as drapes and shapes of the pieces of cloth with which hardens the skin of a bull that is Spain.

For those of you that do not have a professional drawing program and need to convert colors in different models, you can visit The Coloring Pages that I used to so not to confuse between amalgam of all colors.

Traducción al español aquí.

Colores a la carta

Los usuarios perciben los colores mediante el sentido de la vista y la vista no engaña ¿o sí?.

En un monitor moderno, tipo LCD o LED, la imagen en color se forma por la mezcla aditiva a partir de los colores básicos rojo (R-Red), verde (G-Green) y azul (B-Blue), por lo que técnicamente se conoce como el modelo de color RGB.

En nuestros ojos los conos son las células sensibles a los colores. Son de tres tipos especializados en cada uno de los colores básicos. El verde y el rojo se perciben con la misma intensidad, pero el azul se percibe con una vigésima parte (1/20) lo que facilita la compresión de imágenes y video en formatos JPEG y MPEG, disminuyendo el componente azul sin apreciar una pérdida sustancial de calidad. Pero todo depende de tener el sentido de la vista mucho o poco desarrollado como los buenos pintores, para los que esa pérdida es importante. El caso contrario se da en los que padecen daltonismo y en casos graves llegan a confundir el rojo y el verde, aunque pueden ver más matices del violeta que las personas de visión normal y son capaces de distinguir algunos objetos camuflados.

Los niveles de RGB para cada color van del mínimo grado 0 al máximo grado 255 de luminosidad, por lo que un solo punto de luz puede ser alterado por 16.777.216 (256x256x256) de valores diferentes RGB de (0,0,0) a (255,255,255), para los que es suficiente con monitores de 24 bits, pero suelen ser de 32 bits, con hasta 4.294.967.296 colores (aunque suelen ser 8 bits por valor de RGB y 8 bits de transparencia alpha, dependiendo de la tarjeta gráfica. Para ello se emplean otros modelos de color, como el CMYK (por sus siglas en ingles Cyan Magenta Yellow blacK) con diferentes profundidades de color. Los colores de las páginas web como la que estás viendo ahora son generados mediante códigos de colores HTML que representan sus respectivos valores RGB.

Resumiendo, que "nada es verdad, nada es mentira, todo depende del color del cristal con que se mira" pero lo que no es de recibo es que los profesionales del diseño orientado al usuario usemos una paleta de colores no estándar o variable y que no siga los requisitos técnicos y legales oficialmente establecidos, y eso se da más a menudo de lo que debería por dejadez o por las malditas prisas.

Como un pequeño ejercicio colorido, adjunto tres hojas excel con las banderas de la India, de España y de Europa, con los colores oficiales de los respectivos países:




El Real Decreto 441/1981, de 27 de febrero, especifica técnicamente los colores de la Bandera de España:

Color	Denominación color	Tono H en º	Croma C	Claridad L
Amarillo	Amarillo gualda bandera	85.0	95.0	80.0
Rojo	Rojo bandera	35.0	70.0	37.0

Y además indica una tolerancia de 5 unidades CIELAB, por lo que la bandera española está hecha de más de dos colores, tantos como paños y formas de las piezas de tela con las que curte esta piel de toro que es España.

Para el que no tenga un programa profesional de dibujo y necesite convertir colores en diferentes modelos puede visitar The Coloring Pages que a mí me sirve para no confundirlos entre tanta amalgama.

English translation of this post here.