Quadro “Snow” Demo Color Values

To make your blog look like the Snow Demo, copy the color values listed here and use them on the corresponding color selector on Tumblr’s customization sidebar:

Header Background

#fafafa

Logo Text

#4d82ff

Logo Text Hover

#494c50

Main Background

#eaeff6

Main Text

#798086

Headings

#8d97a5

Accent

#4d82ff

Links

#4d82ff

Links Hover

#494c50

Aside Background

#fafafa

Aside Text

#798086

Aside Headings

#61666b

Aside Links

#4d82ff

Aside Links Hover

#202020

Aside Menu Text Hover

#f5f5f5

Aside Submenu Background

#1b1c1d

Box Border

#fafafa

Box Background

#f4f5f5

Box Text

#797f86

Box Tags Background

#eff0f0

Box Tags Text

#bfc2c5

Box Tags Text Hover

#848990

Reading Pane Background

#eff0f0

Reading Pane Text

#6f757b

Link Answer Well Background

#fafafa

Link Answer Well Text

#6f757b

Link Answer Well Text Hover

#4d82ff

Post Type Icons Background

#fafafa

Post Type Icons Stroke

#4d82ff

Box Actions Background

#fafafa

Box Actions Stroke

#bcbfc3

Liked Heart Stroke

#cd1828

Permalinks Actions Background

#d1d5db

Permalinks Actions Stroke

#a9aeb1

Share Box Background

#dadbdd

Share Box Text

#61666b

Share Box Icon Background

#9fa3a8

Share Box Icon Fill

#ffffff

Pagination Background

#fafafa

Pagination Animation Dots

#798086

Social Links Background

#797f86

Permalinks Tags Background

#d1d5db

Permalinks Tags Background Hover

#4d82ff

Permalinks Tags Text

#798086

Permalinks Tags Text Hover

#f5f5f5

Selection Background

#222425

Selection Text

#f5f5f5

Custom CSS

Besides the custom colors, the “snow” demo uses some Custom CSS to make some gradients and drop shadows a little more subtle. You can copy the following CSS snippet and paste it on the Add Custom CSS box, on the Advanced options section of the customization sidebar:

#grid .post-inner {
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);
}

#grid .post-media,
#grid .reading-pane {
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
}

#grid .post-tags {
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.05);
}

.site-aside::before {
    box-shadow: none;
}

.aside-avatar::after,
.masthead-inner::after {
    height: 60px;
    opacity: 0.1;
}

.aside-toggle {
    background: transparent;
}