Pero no sé si os habéis enterado de esta notición, amigos, porque tenemos logo oficial de CSS.
Sí, sí.
Es que este logo no era el logo oficial.
Nunca era el logo que todos buscábamos.
Estábamos buscando un nuevo logo.
Este logo se ha quedado un poco...
Claro, era de CSS3, pero no del lenguaje de CSS, ¿no?
Entonces, claro, teníamos ahí en un montón de sitios este logo con este 3.
¿Y qué pasó?
Pues desde que hace un par de meses se inicializó la búsqueda de un nuevo logo.
Empezó la búsqueda el 1 de agosto para el nuevo logo de CSS y ya tenemos logo oficial.
Y ojo que hay sorpresas, hay sorpresas.
Bueno, así empezó la cosa.
Teníamos un montón de logos, alguno más oficial que el otro y tal.
Y estos son algunas de las posibilidades, gente que dijo, bueno,
que vamos a hacer algún logo y tal.
Este es uno de los logos que aparecieron.
No sé qué os parece este.
Muy moderno las cosas como son.
Bastante moderno este.
Además, con unos colores ahí bastante bonicos.
Aquí ya tenemos un spoiler.
Ya tenemos un spoiler porque el candidato era este.
De Javi Aguilar.
Además, una persona, o sea, una persona de España.
El logo oficial es de una persona de España que está viviendo en Berlín y trabajando allá.
Estos son los logos de JavaScript, de TypeScript, de WebAssembly y este es el nuevo logo de CSS.
Aquí lo tenéis con este color en blanco, en negro.
Pero además, también va a estar numerado.
Vamos a tener números.
Vamos a tener 5, el 6, el 7.
Ya sabéis que ahora vamos a tener versiones de CSS.
Va a salir CSS 4 ya ha salido.
El 5 será el siguiente.
6, 7.
Y aquí tendríamos los colores de todos los logos oficiales.
Y sí, amigos.
Estos son los logos oficiales de cada uno de ellos.
Parece mentira.
Pero el de HTML también es este.
No es el otro.
El otro es otro inventado.
¿Qué le vamos a hacer?
Pero sí, estos son los logos oficiales.
De hecho, es curioso porque en realidad el logo de JavaScript tampoco es oficial al 100%.
Es un poco raro.
Se ha entendido que es el oficial, pero no hay como un logo oficial.
Es como el más utilizado, aceptado universalmente, pero no es logo oficial.
O sea, representa JavaScript, pero no es el logo oficial.
¿Vale?
Solo que, bueno, ya lo utilizamos siempre así.
Este logo así, mítico.
Ya lo utilizamos así y es lo que hay.
Es más oficial el de TypeScript que el de JavaScript.
El de JavaScript no es oficial, pero bueno, ya siempre lo utilizamos y ya está.
Bueno, pues este es el nuevo logo oficial de CSS.
¿Cómo ha sido esto?
Bueno, pues aquí tenemos el repositorio donde ya tenéis toda la información.
Se inició en esta ISU.
Aquí tenemos diferentes ideas de cómo podían ser los logos.
Un montón de logos.
Una locura aquí.
De logos que habían hecho.
Fijaos en este.
A mí este no me gustaba nada.
Este tampoco, la verdad.
No, esto no, por favor.
Con inteligencia artificial.
La gente intentando con inteligencia artificial también.
No, por favor.
Inteligencia artificial no.
Y finalmente, mira, aquí tenemos otros diferentes.
También se había hecho este.
No sé si hay alguno que os ha gustado alguno.
¿Os ha gustado alguno que hayáis visto que digáis, guau, este me gustaba mucho más?
Este también estaba bonito, la verdad.
No sé por qué lo ponen en una bolsa, que es en el último sitio o en el sitio menos típico donde se va a poner el logo.
Pero bueno, no está mal.
Aquí este, con la gracia de CSS, este no estaba mal.
Como chiste, no estaba mal.
¿Vale?
Mira, aquí poniendo el número.
¿Vale?
Con lo de fuera, lo de CSS.
Aquí este, este It's Javi es el que ha hecho el definitivo.
Fijaos que aquí empezó haciendo esto de CSS.
Y aquí ya lo puso dentro.
Y además, hizo este border radius y dejando el punto aquí, a la izquierda.
El de HTML sí que creo que ese es el oficial.
Creo que sí.
HTML, vamos a buscar.
Logo oficial.
Pero yo creo que sí que es...
Claro, es que la gente...
Aparece este, pero este no es el oficial.
Y el oficial creo que sí que es el otro que se ve.
Claro, es que este es el logo oficial de HTML5.
De la versión de HTML5.
No de HTML como tal.
¿Vale?
De HTML como tal, creo que es el otro.
Creo que es el antiguo, el que habéis visto por ahí.
Es que claro, una cosa es el logo de la versión y otro del lenguaje como tal.
Bueno, pues dice...
Al final parece ser que están convergiendo en este, ¿no?
Al final se han quedado con este.
Hicieron la fuente un poquito más gordita.
Y votaron por los colores, ¿vale?
¿Por qué?
Porque había diferentes colores que tenían que decidir.
Y el color definitivo con el que se han quedado es un color muy especial.
Hostia, hay gente que lo odia y todo, ¿eh?
Bueno, el color...
Mira, Manz incluso dejó su versión.
Pero al final no se quedaron con el de Manz.
Se quedaron con el de It's Javi.
Que al final...
Bueno, es que fijaos toda la iteración de todos los que han ido haciendo.
Es que hay un montón, ¿eh?
La gente lo intentó ahí bastante.
¿Y por qué se han quedado con este?
Bueno, se han quedado con este además...
Además de que se parecen lo suficiente a los demás.
Se han quedado con el color este.
Porque este color que veis aquí es el color de Rebecca Purple.
Rebecca Purple es un color escondido en CSS.
Que es este lila.
Que es en honor a la hija de Eric Meyer.
Uno de los pioneros de los estándares de CSS.
Que perdió a su hija de un cáncer cerebral.
Cuando...
A la edad de 6 años.
No sé si lo sabíais.
Entonces, este color, Rebecca Purple, es en honor a la hija de Eric Meyer.
Que tuvo mucha importancia en el mundo del CSS.
Así que cuando utilizáis este color.
Que sepáis que es además en un nombre este color.
Rebecca Purple.
Este color es el que es en honor a su hija.
Y este color es el color que han decidido que sea el que está también en el logo.
De CSS.
Que la verdad, me parece un detallazo.
Es un easter egg bastante escondido.
Tiene todo el sentido del mundo.
Porque es el color más icónico de CSS.
Más conocido.
¿Ves?
Aquí lo veis.
Después de diferentes iteraciones.
El resultado final.
Es con el color maravilloso de Rebecca Purple.
Y además, también va a tener diferentes variaciones.
Vamos a tener la variación en oscuro.
Y también la variación en blanco.
O sea, lo teníamos en blanco y en negro.
Estos serían los colores.
Lo tenéis aquí en Figma.
En Geek Capital.
It's Javi lo ha dejado por aquí.
Con los diferentes colores.
Aquí explica un poco la versión final.
Cómo fue la idea y todo esto.
Fijaos que aquí tenéis pues cómo sería el Figma.
La verdad es que no me gusta mucho el número.
Los números.
No sé si estos son los definitivos.
Espero que no.
Porque la verdad es que no me gusta.
No me gusta mucho este 3.
Que me parece como demasiado grande.
Mira, este no me desagrada.
Pero no me gusta mucho ese número.
Este final.
Este número me parece como demasiado bestia.
Un poco raro.
Un poco raro.
La verdad.
Y aquí lo tenemos con los demás.
Con los diferentes colores.
El azul era el que se utilizaba antes.
Pero al final se ha quedado con el Rebecca Purple.
Que además tiene una historia con mucho significado.
Me parece que está súper bien.
Ya podéis encontrar el logo oficial.
En diferentes tintas.
En SVG también.
Por si lo necesitáis.
De hecho, espero.
SVG lo ha puesto ya.
A ver, Feralp.
¿Has puesto ya el nuevo logo?
¿No lo has puesto todavía?
Bueno, pues le podéis hacer un APR al bueno de Feralp.
¿Veis?
Podéis hacer Submit logo.
Y podéis hacerle un APR para que ponga el nuevo logo.
Con el nuevo color oficial.
Que es este, el nuevo logo.
Los tenéis aquí ya para descargar en PNG.
Lo tenéis en el color en blanco.
En negro, el original en violeta también.
Bueno, en violeta, en púrpura.
¿Vale?
Y este es el logo oficial.
Una cosa que es muy interesante, el logo oficial.
Es que ha sido todo con votación popular.
O sea, al final ha sido todo en abierto.
En un repositorio.
La gente ha podido enviar el logo que querían.
Ha estado bastante bien.
Y es que muchas veces vosotros, todos ustedes.
Tienen la posibilidad de hacer que, de alguna forma.
Pues evolucione CSS como crean.
Ahora, por ejemplo, hay una pregunta muy importante.
Que ya alguna vez lo hemos comentado.
Que es el masonry.
¿Vale?
Este tipo de layout masonry.
Que se utiliza un montón de páginas.
Como por ejemplo Pinterest y tal.
Que normalmente se necesitaban, pues, bibliotecas JavaScript.
Para hacerlas.
De hecho, masonry.js.
Había esta biblioteca muy famosa.
Para hacerlo.
Y, ojo, porque masonry es un poco complicado.
Porque parece que son columnas fáciles.
Pero también puede cambiar el número de...
O sea, puede ser así también.
¿Sabes?
Pueden tener diferentes anchos.
Y claro, ahí puede ser un poco más complicado de lo que parece.
Bueno, pues, hay diferentes propuestas de cómo añadir masonry en el CSS.
Una de ellas es entender que tiene que ser masonry directamente.
Pero hay gente que cree que debería estar dentro de Grid.
Yo, la verdad, que soy de la opción de que sea un display totalmente diferente.
Y que no esté dentro de Grid.
Que me parece como demasiado complicado.
Creo que la gente de Google está más por la opción de que sea dentro de Grid.
Si no me equivoco.
Y la gente de Apple está más por la idea de que sea dentro de display masonry.
No lo sé.
Ahora no me acuerdo.
Pero esas son las dos ideas, ¿vale?
Solo para que lo sepáis de que están pidiendo vuestro feedback.
O sea, que le podéis escribir en muchos de los sitios ahí.
No sé si en la especificación.
En algún sitio están recuperando ahí vuestro feedback.
Así que le podéis echar un vistazo.
Yo lo prefiero que sea separado.
Ojalá que sí.
Porque creo que si no va a complicar demasiado ya Grid.
Y ya Grid tiene como demasiadas cosas.
Yo creo que display masonry tiene más sentido.
Por más que sea bastante parecido a Grid.
Y ya está.
Así que ahí lo tienen.
¡Gracias!
¡Gracias!
¡Gracias!