Home ‣ Style guide

Style guide

Cultura, eventi e una Media House.KRANG è il nostro progetto editoriale, B2B Day il nostro evento di settore, MA Studios uno spazio per la produzione di contenuti. testo a caso PAROLA MAGICA testo a caso

H1 - The quick brown fox jumps over the lazy dog

H2 - The quick brown fox jumps over the lazy dog

H3 - The quick brown fox jumps over the lazy dog

H4 - The quick brown fox jumps over the lazy dog

Subtitle (subtitle) - The quick brown fox jumps over the lazy dog

Body_paragraph (text-paragraph) - The quick brown fox jumps over the lazy dogc

Body (text-body) - The quick brown fox jumps over the lazy dog

Link (link) - The quick brown fox jumps over the lazy dog

Button (button) - The quick brown fox jumps over the lazy dog

Caption (caption) - The quick brown fox jumps over the lazy dog

Buttons

Clicca qua
Clicca qua
Clicca qua
Clicca qua
Clicca qua
Clicca qua
bottone rosa
bottone orange
bottone tiktok

Disabled

Disabled

Input

Input text

Input radio

Eventuale ulteriore spiegazione che aiuta a compilare il campo

Input checkbox

Eventuale ulteriore spiegazione che aiuta a compilare il campo


Input text mega

Come ti chiami?

Selezioni colori
white
HOVER
MD HOVER
#010101
black
HOVER
MD HOVER
#215C21
verdone
HOVER
MD HOVER
#6E1FD6
viola
HOVER
MD HOVER
#FFB800
giallo
HOVER
MD HOVER
#FF5900
orange
HOVER
MD HOVER
#0A05DB
blu
HOVER
MD HOVER
#FF8CFA
rosa
HOVER
MD HOVER
#26CCA1
verdino
HOVER
MD HOVER
#E9DBFA
viola-50
HOVER
MD HOVER
#E7E6FB
blu-50
HOVER
MD HOVER
#D9F8F2
verdino-50
HOVER
MD HOVER
#FFE4FE
rosa-50
HOVER
MD HOVER
#F2F3F6
black-100
HOVER
MD HOVER
#3AA33A
verdone-400
HOVER
MD HOVER
#A5DFA5
verdone-100
HOVER
MD HOVER
#9B60E8
viola-400
HOVER
MD HOVER
#DECBF8
viola-100
HOVER
MD HOVER
#FEA400
giallo-700
HOVER
MD HOVER
#FFB800
giallo-600
HOVER
MD HOVER
#FECD28
giallo-400
HOVER
MD HOVER
#FFEFB4
giallo-100
HOVER
MD HOVER
#FF8940
orange-400
HOVER
MD HOVER
#FFB593
orange-200
HOVER
MD HOVER
#3B37E2
blu-400
HOVER
MD HOVER
#CECDF8
blu-100
HOVER
MD HOVER
white
HOVER
MD HOVER
#010101
black
HOVER
MD HOVER
#215C21
verdone
HOVER
MD HOVER
#6E1FD6
viola
HOVER
MD HOVER
#FFB800
giallo
HOVER
MD HOVER
#FF5900
orange
HOVER
MD HOVER
#0A05DB
blu
HOVER
MD HOVER
#FF8CFA
rosa
HOVER
MD HOVER
#26CCA1
verdino
HOVER
MD HOVER
#E9DBFA
viola-50
HOVER
MD HOVER
#E7E6FB
blu-50
HOVER
MD HOVER
#D9F8F2
verdino-50
HOVER
MD HOVER
#FFE4FE
rosa-50
HOVER
MD HOVER
#F2F3F6
black-100
HOVER
MD HOVER
#3AA33A
verdone-400
HOVER
MD HOVER
#A5DFA5
verdone-100
HOVER
MD HOVER
#9B60E8
viola-400
HOVER
MD HOVER
#DECBF8
viola-100
HOVER
MD HOVER
#FEA400
giallo-700
HOVER
MD HOVER
#FFB800
giallo-600
HOVER
MD HOVER
#FECD28
giallo-400
HOVER
MD HOVER
#FFEFB4
giallo-100
HOVER
MD HOVER
#FF8940
orange-400
HOVER
MD HOVER
#FFB593
orange-200
HOVER
MD HOVER
#3B37E2
blu-400
HOVER
MD HOVER
#CECDF8
blu-100
HOVER
MD HOVER
Black
#010101
black-900
#232323
black-800
#333333
black-700
#636365
black-600
#87888A
black-default
#87888A
black-500
#BABCC2
black-400
#D7DADF
black-300
#E8EAEE
black-200
#F2F3F6
black-100
#F8F9FA
black-50
#FFFFFF
white
Verdone
#215C21
verdone-500
#215C21
verdone
#3AA33A
verdone-400
#60C660
verdone-300
#87D487
verdone-200
#A5DFA5
verdone-100
Viola
#6E1FD6
viola-500
#6E1FD6
viola default
#9B60E8
viola-400
#BA92EF
viola-300
#D0B4F4
viola-200
#DECBF8
viola-100
#E9DBFA
viola-50
Giallo
#FEA400
giallo-700
#FFB800
giallo-600
#FFB800
giallo
#FECD28
giallo-400
#FEE284
giallo-200
#FFEFB4
giallo-100
Verdino
#1FA78E
verdino-600
#26CCAD
verdino
#26CCAD
verdino-500
#61E2CA
verdino-400
#B2F1E5
verdino-200
#C9F5ED
verdino-100
#D9F8F2
verdino-50
Orange
#D94400
orange-600
#FF5900
orange-500
#FF5900
orange
#FF8940
orange-400
#FFB593
orange-200
#FFD2C2
orange-50
Blu
Prova
#0A05DB
blu-500
Prova
#0A05DB
blu
#3B37E2
blu-400
#9D9BF1
blu-300
#B6B4F4
blu-200
#CECDF8
blu-100
#E7E6FB
blu-50
#E7E6FB 50%
blu-50/50
Rosa
#FF51F6
rosa-600
#FF8CFA
rosa-500
#FF8CFA
rosa
#FFA9FB
rosa-400
#FFBEFC
rosa-300
#FFCFFD
rosa-200
#FFDBFD
rosa-100
#FFE4FE
rosa-50
Error
#D83037
error-600
#EA3A3D
error-500
#EA3A3D
error
#F65557
error-400
#E87579
error-300
#F19C9E
error-200
#F9C4C5
error-100
#FFE0E6
error-50
Shadow
#010101 | 50% to 0%
shadow-top-down
#010101 | 0% to 50%
shadow-down-top
#232323 80%
black-800/80

C'è un mondo intero dietro alla realizzazione di una macchina, pieno di attori e strumenti.

Scopri i progetti technology

Verdino 500
Black 900

Il B2B, quello nudo crudo e puro. Complesso, ma intrigante

Scopri i progetti technology

Rosa 500
Black 900

Storie del territorio e dei suoi prodotti.

Scopri i progetti technology

Giallo 600
Black 900

Storie del territorio e dei suoi prodotti.

Scopri i progetti technology

Orange 500
Black 900

C'è un mondo intero dietro alla realizzazione di una macchina, pieno di attori e strumenti.

Scopri i progetti technology

Verdino 50
Black 900

Il B2B, quello nudo crudo e puro. Complesso, ma intrigante

Scopri i progetti technology

Viola 50
Black 900

Storie del territorio e dei suoi prodotti.

Scopri i progetti technology

Blu 50
Black 900

Storie del territorio e dei suoi prodotti.

Scopri i progetti technology

Black 100
Black 900

"It's not just what it looks like, but how it works". Il design è in ogni aspetto della nostra vita, ce ne sono mille sfumature.

Scopri i progetti technology

Blu 500
White

"It's not just what it looks like, but how it works". Il design è in ogni aspetto della nostra vita, ce ne sono mille sfumature.

Scopri i progetti technology

Viola 500
White

Le destinazioni possono essere piccoli paradisi di relax per ognuno di noi. È giusto dargli la giusta dignità digitale.

Scopri i progetti technology

Verdone 500
White

Le destinazioni possono essere piccoli paradisi di relax per ognuno di noi. È giusto dargli la giusta dignità digitale.

Scopri i progetti technology

Black 900
White

Lorem ipsum dolor sit amet consectetur. Pulvinar volutpat pharetra vitae odio purus ut urna pharetra vestibulum. Est sapien duis commodo tincidunt pulvinar. Dapibus lorem at ullamcorper faucibus.

Lorem ipsum dolor sit amet consectetur. Pulvinar volutpat pharetra vitae odio purus ut urna pharetra vestibulum. Est sapien duis commodo tincidunt pulvinar. Dapibus lorem at ullamcorper faucibus.

Lorem ipsum dolor sit amet consectetur. Pulvinar volutpat pharetra vitae odio purus ut urna pharetra vestibulum. Est sapien duis commodo tincidunt pulvinar. Dapibus lorem at ullamcorper faucibus.

Lorem ipsum dolor sit amet consectetur. Pulvinar volutpat pharetra vitae odio purus ut urna pharetra vestibulum. Est sapien duis commodo tincidunt pulvinar. Dapibus lorem at ullamcorper faucibus.