CEIP Plurilíngüe de BelesarSistema de estilo
CEIP Plurilíngüe de Belesar · Baiona

Sistema de estilo

Todo o necesario para que calquera páxina, documento ou publicación do centro se recoñeza como nosa: cores, tipografías, compoñentes e plantillas listas para usar.

Tokens

Cores, tipografía, espazado, radios e sombras. Valores copiables ao clic, en CSS e JSON.

Ver tokens →

Compoñentes

Botóns, formularios, táboas, avisos e navegación xa estilados e accesibles.

Ver compoñentes →

Manual de identidade

As 17 páxinas do manual: logotipo, usos correctos, aplicacións e criterios web.

Abrir manual →

Plantillas

Circulares, certificados, diplomas, tarxetas, carteis e placas, editables e imprimibles.

Ver plantillas →

Descargas

Logotipos, follas de estilo e ficheiros de tokens para levar ao teu proxecto.

Descargar →
Empezar

Engadir o estilo a unha páxina

Dúas follas de estilo e as dúas fontes. Todas as variables e clases levan o prefixo --bl- e .bl-, así que non chocan con ningún framework.

<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Nunito:wght@400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://estilo.ceipbelesar.org/css/tokens.css">
<link rel="stylesheet" href="https://estilo.ceipbelesar.org/css/componentes.css">
Criterios

Tres regras que non se negocian

A identidade vive nos bordes

Verde bosque na cabeceira, no rodapé e no botón principal. O contido lese sobre crema ou branco, nunca bloques longos de texto sobre verde.

Fredoka titula, Nunito explica

Fredoka en titulares, menú, botóns e cifras. Nunito en todo o texto corrido e nos formularios. Corpo de 16 px como mínimo.

Accesible por obriga

Contraste 4.5:1, foco sempre visible, área táctil de 44 px, lang="gl" e ningún estado indicado só coa cor.