{"id":12302,"date":"2025-06-30T10:58:59","date_gmt":"2025-06-30T10:58:59","guid":{"rendered":"https:\/\/dev.sainformatica.site\/index.php\/more\/color-palette\/"},"modified":"2026-06-02T16:07:10","modified_gmt":"2026-06-02T14:07:10","slug":"color-palette","status":"publish","type":"page","link":"https:\/\/dev.sainformatica.site\/index.php\/more\/color-palette\/","title":{"rendered":"Color palette"},"content":{"rendered":"\n
\n
\n
\n
\n

Neutral 950<\/p>\n<\/div>\n\n\n\n

\n

Neutral 900<\/p>\n\n\n\n

Headings<\/p>\n<\/div>\n\n\n\n

\n

Neutral 800<\/p>\n\n\n\n

Borders – dark bg<\/p>\n<\/div>\n\n\n\n

\n

Neutral 700<\/p>\n<\/div>\n\n\n\n

\n

Neutral 600<\/p>\n\n\n\n

Text default<\/p>\n<\/div>\n\n\n\n

\n

Neutral 500<\/p>\n\n\n\n

Text medium<\/p>\n<\/div>\n\n\n\n

\n

Neutral 400<\/p>\n\n\n\n

Text – dark bg<\/p>\n<\/div>\n\n\n\n

\n

Neutral 300<\/p>\n<\/div>\n\n\n\n

\n

Neutral 200<\/mark><\/p>\n\n\n\n

Borders<\/p>\n<\/div>\n\n\n\n

\n

Neutral 100<\/p>\n\n\n\n

Content cards<\/p>\n<\/div>\n\n\n\n

\n

Neutral 100<\/p>\n\n\n\n

Light bg<\/p>\n<\/div>\n\n\n\n

\n

Neutral 000<\/p>\n\n\n\n

Headings – dark bg<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

Primary 950<\/p>\n<\/div>\n\n\n\n

\n

Primary 900<\/p>\n<\/div>\n\n\n\n

\n

Primary 800<\/p>\n<\/div>\n\n\n\n

\n

Primary<\/mark> 700<\/mark><\/p>\n<\/div>\n\n\n\n

\n

Primar 600<\/p>\n\n\n\n

Button<\/p>\n<\/div>\n\n\n\n

\n

Primary<\/mark> 500<\/mark><\/p>\n\n\n\n

Button, numbers, icons<\/p>\n<\/div>\n\n\n\n

\n

Primary<\/mark> 400<\/mark><\/p>\n<\/div>\n\n\n\n

\n

Primary<\/mark> 300<\/mark><\/p>\n<\/div>\n\n\n\n

\n

Primary<\/mark> 200<\/mark><\/p>\n<\/div>\n\n\n\n

\n

Primary<\/mark> 100<\/mark><\/p>\n<\/div>\n\n\n\n

\n

Primary 50<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

Secondary 950<\/p>\n<\/div>\n\n\n\n

\n

Secondary 900<\/p>\n<\/div>\n\n\n\n

\n

Secondary 800<\/p>\n<\/div>\n\n\n\n

\n

Secondary 700<\/p>\n<\/div>\n\n\n\n

\n

Secondary 600<\/p>\n<\/div>\n\n\n\n

\n

Secondary 500<\/p>\n<\/div>\n\n\n\n

\n

Secondary 400<\/p>\n\n\n\n

Button contrast hover<\/p>\n<\/div>\n\n\n\n

\n

Secondary 300<\/p>\n\n\n\n

Button contrast<\/p>\n<\/div>\n\n\n\n

\n

Secondary 200<\/p>\n<\/div>\n\n\n\n

\n

Secondary 100<\/p>\n<\/div>\n\n\n\n

\n

Secondary 50<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n

Gradient 1<\/p>\n<\/div>\n\n\n\n

\n

Gradient <\/mark>2<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

Gradient 3<\/p>\n<\/div>\n\n\n\n

\n

Gradient <\/mark>4<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

Gradient 5<\/p>\n<\/div>\n\n\n\n

\n

Gradient <\/mark>6<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

Gradient 7<\/p>\n<\/div>\n\n\n\n

\n

Gradient <\/mark>8<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

Gradient 9<\/p>\n<\/div>\n\n\n\n

\n

Gradient <\/mark>10<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

Gradient 11<\/p>\n<\/div>\n\n\n\n

\n

Gradient <\/mark>12<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

Gradient 13<\/p>\n<\/div>\n\n\n\n

\n

Gradient <\/mark>14<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

Natural shadow<\/p>\n<\/div>\n\n\n\n

\n

Deep shadow<\/p>\n<\/div>\n\n\n\n

\n

Sharp shadow<\/p>\n<\/div>\n\n\n\n

\n

Outlined shadow<\/p>\n<\/div>\n\n\n\n

\n

Crisp shadow<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

01<\/p>\n<\/div>\n<\/div>\n\n\n\n

Consectetur elit tellus<\/h3>\n\n\n\n

Amet consectetur adipiscing elit tellus ullamcorper glavrida luctus consectetur adipiscing elit tellus nec.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

02<\/p>\n<\/div>\n<\/div>\n\n\n\n

Amet consectetur<\/h3>\n\n\n\n

Consectetur elit tellus, luctus consectetur adipiscing elit tellus metus dolor elit tellus amet adipiscing.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

03<\/p>\n<\/div>\n<\/div>\n\n\n\n

Donec adipiscing elit<\/h3>\n\n\n\n

Duis tristique id adipiscing lorem ipsum dolor nec nisl pellentesque libero elit tellus adipiscing lorem ipsum!<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

01<\/p>\n<\/div>\n<\/div>\n\n\n\n

Consectetur elit tellus<\/h3>\n\n\n\n

Amet consectetur adipiscing elit tellus ullamcorper glavrida luctus consectetur adipiscing elit tellus nec.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

02<\/p>\n<\/div>\n<\/div>\n\n\n\n

Amet consectetur<\/h3>\n\n\n\n

Consectetur elit tellus, luctus consectetur adipiscing elit tellus metus dolor elit tellus amet adipiscing.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

03<\/p>\n<\/div>\n<\/div>\n\n\n\n

Donec adipiscing elit<\/h4>\n\n\n\n

Duis tristique id adipiscing lorem ipsum dolor nec nisl pellentesque libero elit tellus adipiscing lorem ipsum!<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

01<\/p>\n<\/div>\n<\/div>\n\n\n\n

Consectetur elit tellus<\/h3>\n\n\n\n

Amet consectetur adipiscing elit tellus ullamcorper glavrida luctus consectetur adipiscing elit tellus nec.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

02<\/p>\n<\/div>\n<\/div>\n\n\n\n

Amet consectetur<\/h3>\n\n\n\n

Consectetur elit tellus, luctus consectetur adipiscing elit tellus metus dolor elit tellus amet adipiscing.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

03<\/p>\n<\/div>\n<\/div>\n\n\n\n

Donec adipiscing elit<\/h4>\n\n\n\n

Duis tristique id adipiscing lorem ipsum dolor nec nisl pellentesque libero elit tellus adipiscing lorem ipsum!<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

01<\/p>\n<\/div>\n<\/div>\n\n\n\n

Consectetur elit tellus<\/h3>\n\n\n\n

Amet consectetur adipiscing elit tellus ullamcorper glavrida luctus consectetur adipiscing elit tellus nec.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

02<\/p>\n<\/div>\n<\/div>\n\n\n\n

Amet consectetur<\/h3>\n\n\n\n

Consectetur elit tellus, luctus consectetur adipiscing elit tellus metus dolor elit tellus amet adipiscing.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

03<\/p>\n<\/div>\n<\/div>\n\n\n\n

Donec adipiscing elit<\/h4>\n\n\n\n

Duis tristique id adipiscing lorem ipsum dolor nec nisl pellentesque libero elit tellus adipiscing lorem ipsum!<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

01<\/p>\n<\/div>\n<\/div>\n\n\n\n

Consectetur elit tellus<\/h3>\n\n\n\n

Amet consectetur adipiscing elit tellus ullamcorper glavrida luctus consectetur adipiscing elit tellus nec.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

02<\/p>\n<\/div>\n<\/div>\n\n\n\n

Amet consectetur<\/h3>\n\n\n\n

Consectetur elit tellus, luctus consectetur adipiscing elit tellus metus dolor elit tellus amet adipiscing.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

03<\/p>\n<\/div>\n<\/div>\n\n\n\n

Donec adipiscing elit<\/h4>\n\n\n\n

Duis tristique id adipiscing lorem ipsum dolor nec nisl pellentesque libero elit tellus adipiscing lorem ipsum!<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

98.5%<\/p>\n\n\n\n

Lorem ipsum dolor<\/h3>\n<\/div>\n\n\n\n
\n
\n
\n

%<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

Consectetur adipiscing convallis <\/h3>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

\u2014<\/p>\n\n\n\n

Lorem consectetur ipsum adipiscing<\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Consectetur adipiscing convallis <\/p>\n<\/div>\n\n\n\n

\n

\u2014<\/p>\n\n\n\n

Donec adipiscing elit tellus<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n
\n

01<\/p>\n<\/div>\n<\/div>\n\n\n\n

Consectetur elit tellus<\/h3>\n\n\n\n

Amet consectetur adipiscing elit tellus ullamcorper glavrida luctus consectetur adipiscing elit tellus nec.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

02<\/p>\n<\/div>\n<\/div>\n\n\n\n

Amet consectetur<\/h3>\n\n\n\n

Consectetur elit tellus, luctus consectetur adipiscing elit tellus metus dolor elit tellus amet adipiscing.<\/p>\n<\/div>\n\n\n\n

\n
\n
\n

03<\/p>\n<\/div>\n<\/div>\n\n\n\n

Donec adipiscing elit<\/h4>\n\n\n\n

Duis tristique id adipiscing lorem ipsum dolor nec nisl pellentesque libero elit tellus adipiscing lorem ipsum!<\/p>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

Neutral 950 Neutral 900 Headings Neutral 800 Borders – dark bg Neutral 700 Neutral 600 Text default Neutral 500 Text medium Neutral 400 Text – dark bg Neutral 300 Neutral 200 Borders Neutral 100 Content cards Neutral 100 Light bg Neutral 000 Headings – dark bg Primary 950 Primary 900 Primary 800 Primary 700 Primar […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":8024,"menu_order":5,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-12302","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/dev.sainformatica.site\/index.php\/wp-json\/wp\/v2\/pages\/12302","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dev.sainformatica.site\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dev.sainformatica.site\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dev.sainformatica.site\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dev.sainformatica.site\/index.php\/wp-json\/wp\/v2\/comments?post=12302"}],"version-history":[{"count":0,"href":"https:\/\/dev.sainformatica.site\/index.php\/wp-json\/wp\/v2\/pages\/12302\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/dev.sainformatica.site\/index.php\/wp-json\/wp\/v2\/pages\/8024"}],"wp:attachment":[{"href":"https:\/\/dev.sainformatica.site\/index.php\/wp-json\/wp\/v2\/media?parent=12302"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}