Color schemes dissected
A static preview of the included color schemes is available here.
If you want to create a custom color scheme from scratch based on one of the built-in color palettes, you need to enable the options Override accent colors and Override base colors, then use the following values as a basis for the color options on the customizer.
Asphalt
We won’t go into much detail here, as the asphalt colors are the default values you get with a fresh theme installation. You can check these default values here already.
Clouds
Accent colors
| Variable name | Description | Default value |
|---|---|---|
| Accent | Main accent color—applies to several theme elements | #f26972 |
| Text post accent | Accent color for Photo posts | #66688f |
| Photo post accent | Accent color for Text posts | #f26972 |
| Quote post accent | Accent color for Quote posts | #508391 |
| Link post accent | Accent color for Link posts | #766392 |
| Chat post accent | Accent color for Chat posts | #779353 |
| Audio post accent | Accent color for Audio posts | #4f8c65 |
| Video post accent | Accent color for Video posts | #b2708f |
| Answer post accent | Accent color for Answer posts | #ee7b58 |
| Logo text | Text color for the blog title | #f26972 |
| Logo text hover | Text color for the blog title, on hover | #f48088 |
| Link | Base color for links, overriden by post type accents | #f26972 |
| Link hover | Color for links, on hover | #575a60 |
| Button bg hover | Buttons background color, on hover | #f26972 |
| Button border hover | Buttons border color, on hover | #f15f69 |
| Button text hover | Buttons text color, on hover | #d6d9e1 |
| Pagination bg hover | Pagination buttons background color, on hover | #f26972 |
| Pagination border hover | Pagination buttons border color, on hover | #f15f69 |
| Pagination text hover | Pagination buttons text color, on hover | #d6d9e1 |
| Footer link | Text color for links on the footer | #f26972 |
| Footer link hover | Text color for links on the footer, on hover | #575860 |
| Aside link hover | Text color for links on the sidebar, on hover | #f26972 |
| Aside tag bg hover | Sidebar tags background color, on hover | #f26972 |
| Aside tag border hover | Sidebar tags border color, on hover | #f15f69 |
| Aside tag text hover | Sidebar tags text color, on hover | #d6d9e1 |
| Aside trigger fill | Fill color for the sidebar toggle icon | #f26972 |
| Aside trigger fill hover | Fill color for the sidebar toggle icon, on hover | #f48088 |
Base colors
| Variable name | Description | Default value |
|---|---|---|
| Body bg | Body background color | #c4c8d4 |
| Selection bg | Background color for selected text | #898c94 |
| Selection text | Text color for selected text | #e4e4e7 |
| Header bg | Header background color | #d6d9e1 |
| Header border | Header border color | #dddfe6 |
| Footer bg | Footer background color | #d6d9e1 |
| Footer border | Footer border color | #dddfe6 |
| Footer text | Footer text color | #898a94 |
| Elevator fill | ‘Scroll to top’ button fill color | #666670 |
| Navi text | Navigation text color (also applies to the header description) | #666670 |
| Navi text hover | Navigation text color, on hover | #131315 |
| Dropdown bg | Navigation dropdowns background color | #dddfe6 |
| Dropdown border | Navigation dropdowns border color | #e5e6eb |
| Mobile nav bg | Mobile navigation background color | #caced8 |
| Mobile nav subs bg | Mobile navigation sub-sections background color | #bec3cf |
| Mobile nav text | Mobile navigation text color | #666670 |
| Mobile nav icon | Mobile navigation plus icon fill color | #858691 |
| Post bg | Individual post main background color | #d6d9e1 |
| Post date text | Post date text color (also applies to post type icon fill) | #d6d9e1 |
| Post media bg | Post media background color | #38394d |
| Post media border | Post media bottom border color | #2d2e3e |
| Post media shape fill | Fill color for the icons inside post media (quotes, links, chat, etc.) | #303143 |
| Post shadow | Color for individual posts box-shadow | #494b50 |
| Post text | Color for individual posts text | #666670 |
| Post title | Color for posts headings | #9fa0b2 |
| Post slider dot | Fill color for the slider pagination controls (for photosets) | #585979 |
| Button bg | Buttons background color (individual post accents override this) | #c4cade |
| Button border | Buttons border color | #bdc5db |
| Button text | Buttons text color | #6b6b76 |
| Pagination bg | Pagination buttons background color | #d6d9e1 |
| Pagination border | Pagination buttons border color | #d6d9e1 |
| Pagination text | Pagination buttons text color | #6b6b76 |
| Aside bg | Sidebar background color | #38394d |
| Aside text | Sidebar text color | #c4c4ca |
| Aside title | Sidebar headings color | #9395a9 |
| Aside link | Sidebar links color | #b7b9be |
| Aside tag bg | Sidebar tags background color | #303143 |
| Aside tag border | Sidebar tags border color | #2c2d3d |
| Aside tag text | Sidebar tags text color | #a9aab1 |
| Aside trigger bg | Background color for the sidebar toggle | #38394d |
| Aside scrollbar | Color for the sidebar scrollbar handle | #22232f |
| Aside slider dot | Fill color for the sidebar sliders pagination controls (for photostreams) | #2b2c3b |
| Search input bg | Search input background color | #303143 |
| Search input text | Search input text color | #c4c4ca |
| Tweet time bg | Background color for the Twitter widget timestamp | #323346 |
| Widget border | Separation between widgets | #2e2f40 |
| Share widget bg | Share widget (modal popup) background color | #38394d |
| Share widget text | Share widget (modal popup) text and icon color | #c4c4ca |
| CTA icon fill | Call-to-action icon fill color | #d6d9e1 |
| CTA icon fill hover | Call-to-action icon fill color, on hover | #f3f4f6 |
| CTA like bg | Call-to-action like button bg color | #bf4048 |
| CTA reblog bg | Call-to-action reblog button bg color | #335f99 |
| CTA share bg | Call-to-action share button bg color | #3b3c51 |
Cream
Accent colors
| Variable name | Description | Default value |
|---|---|---|
| Accent | Main accent color—applies to several theme elements | #fb4b51 |
| Text post accent | Accent color for Photo posts | #f44363 |
| Photo post accent | Accent color for Text posts | #fb4b51 |
| Quote post accent | Accent color for Quote posts | #fda64e |
| Link post accent | Accent color for Link posts | #fdc94e |
| Chat post accent | Accent color for Chat posts | #0c95bb |
| Audio post accent | Accent color for Audio posts | #0c95bb |
| Video post accent | Accent color for Video posts | #0c95bb |
| Answer post accent | Accent color for Answer posts | #01b2ac |
| Logo text | Text color for the blog title | #fb4b51 |
| Logo text hover | Text color for the blog title, on hover | #fc6469 |
| Link | Base color for links, overriden by post type accents | #fb4b51 |
| Link hover | Color for links, on hover | #666666 |
| Button bg hover | Buttons background color, on hover | #fb4b51 |
| Button border hover | Buttons border color, on hover | #fb4147 |
| Button text hover | Buttons text color, on hover | #ffffff |
| Pagination bg hover | Pagination buttons background color, on hover | #fb4b51 |
| Pagination border hover | Pagination buttons border color, on hover | #fb4147 |
| Pagination text hover | Pagination buttons text color, on hover | #ffffff |
| Footer link | Text color for links on the footer | #fb4b51 |
| Footer link hover | Text color for links on the footer, on hover | #666666 |
| Aside link hover | Text color for links on the sidebar, on hover | #fb4b51 |
| Aside tag bg hover | Sidebar tags background color, on hover | #fb4b51 |
| Aside tag border hover | Sidebar tags border color, on hover | #fb4147 |
| Aside tag text hover | Sidebar tags text color, on hover | #ffffff |
| Aside trigger fill | Fill color for the sidebar toggle icon | #fb4b51 |
| Aside trigger fill hover | Fill color for the sidebar toggle icon, on hover | #fc6469 |
Base colors
| Variable name | Description | Default value |
|---|---|---|
| Body bg | Body background color | #f8f4ed |
| Selection bg | Background color for selected text | #8f8f8f |
| Selection text | Text color for selected text | #e6e6e6 |
| Header bg | Header background color | #ffffff |
| Header border | Header border color | #ffffff |
| Footer bg | Footer background color | #ffffff |
| Footer border | Footer border color | #ffffff |
| Footer text | Footer text color | #666666 |
| Elevator fill | ‘Scroll to top’ button fill color | #666666 |
| Navi text | Navigation text color (also applies to the header description) | #666666 |
| Navi text hover | Navigation text color, on hover | #0d0d0d |
| Dropdown bg | Navigation dropdowns background color | #ffffff |
| Dropdown border | Navigation dropdowns border color | #ffffff |
| Mobile nav bg | Mobile navigation background color | #f8f4ed |
| Mobile nav subs bg | Mobile navigation sub-sections background color | #f5f0e6 |
| Mobile nav text | Mobile navigation text color | #666666 |
| Mobile nav icon | Mobile navigation plus icon fill color | #fb4b51 |
| Post bg | Individual post main background color | #ffffff |
| Post date text | Post date text color (also applies to post type icon fill) | #ffffff |
| Post media bg | Post media background color | #e9e5dd |
| Post media border | Post media bottom border color | #dfdacd |
| Post media shape fill | Fill color for the icons inside post media (quotes, links, chat, etc.) | #dfdacd |
| Post shadow | Color for individual posts box-shadow | #76726b |
| Post text | Color for individual posts text | #666666 |
| Post title | Color for posts headings | #a39d8f |
| Post slider dot | Fill color for the slider pagination controls (for photosets) | #fb4b51 |
| Button bg | Buttons background color (individual post accents override this) | #b4ada7 |
| Button border | Buttons border color | #afa8a1 |
| Button text | Buttons text color | #f5f5f5 |
| Pagination bg | Pagination buttons background color | #ffffff |
| Pagination border | Pagination buttons border color | #ffffff |
| Pagination text | Pagination buttons text color | #707070 |
| Aside bg | Sidebar background color | #ffffff |
| Aside text | Sidebar text color | #666666 |
| Aside title | Sidebar headings color | #7B7565 |
| Aside link | Sidebar links color | #fb4b51 |
| Aside tag bg | Sidebar tags background color | #b4ada7 |
| Aside tag border | Sidebar tags border color | #afa8a1 |
| Aside tag text | Sidebar tags text color | #f5f5f5 |
| Aside trigger bg | Background color for the sidebar toggle | #ffffff |
| Aside scrollbar | Color for the sidebar scrollbar handle | #bfbfbf |
| Aside slider dot | Fill color for the sidebar sliders pagination controls (for photostreams) | #d2d2d2 |
| Search input bg | Search input background color | #f6f2e9 |
| Search input text | Search input text color | #666666 |
| Tweet time bg | Background color for the Twitter widget timestamp | #f5f0e6 |
| Widget border | Separation between widgets | #f2f2f2 |
| Share widget bg | Share widget (modal popup) background color | #ffffff |
| Share widget text | Share widget (modal popup) text and icon color | #a39d8f |
| CTA icon fill | Call-to-action icon fill color | #f5f5f5 |
| CTA icon fill hover | Call-to-action icon fill color, on hover | #ffffff |
| CTA like bg | Call-to-action like button bg color | #c56259 |
| CTA reblog bg | Call-to-action reblog button bg color | #5475a0 |
| CTA share bg | Call-to-action share button bg color | #91867e |
Dashboard
Accent colors
| Variable name | Description | Default value |
|---|---|---|
| Accent | Main accent color—applies to several theme elements | #dc7156 |
| Text post accent | Accent color for Photo posts | #666666 |
| Photo post accent | Accent color for Text posts | #dc7156 |
| Quote post accent | Accent color for Quote posts | #f3a444 |
| Link post accent | Accent color for Link posts | #66c294 |
| Chat post accent | Accent color for Chat posts | #61a6d1 |
| Audio post accent | Accent color for Audio posts | #b089c8 |
| Video post accent | Accent color for Video posts | #838e95 |
| Answer post accent | Accent color for Answer posts | #666666 |
| Logo text | Text color for the blog title | #dc7156 |
| Logo text hover | Text color for the blog title, on hover | #e1826b |
| Link | Base color for links, overriden by post type accents | #dc7156 |
| Link hover | Color for links, on hover | #121212 |
| Button bg hover | Buttons background color, on hover | #dc7156 |
| Button border hover | Buttons border color, on hover | #db694d |
| Button text hover | Buttons text color, on hover | #ffffff |
| Pagination bg hover | Pagination buttons background color, on hover | #dc7156 |
| Pagination border hover | Pagination buttons border color, on hover | #db694d |
| Pagination text hover | Pagination buttons text color, on hover | #ffffff |
| Footer link | Text color for links on the footer | #dc7156 |
| Footer link hover | Text color for links on the footer, on hover | #b6bcc3 |
| Aside link hover | Text color for links on the sidebar, on hover | #d2d6da |
| Aside tag bg hover | Sidebar tags background color, on hover | #dc7156 |
| Aside tag border hover | Sidebar tags border color, on hover | #db694d |
| Aside tag text hover | Sidebar tags text color, on hover | #d2d6da |
| Aside trigger fill | Fill color for the sidebar toggle icon | #dc7156 |
| Aside trigger fill hover | Fill color for the sidebar toggle icon, on hover | #e1826b |
Base colors
| Variable name | Description | Default value |
|---|---|---|
| Body bg | Body background color | #36475e |
| Selection bg | Background color for selected text | #36475e |
| Selection text | Text color for selected text | #ffffff |
| Header bg | Header background color | #2f3f56 |
| Header border | Header border color | #2b3a4f |
| Footer bg | Footer background color | #2f3f56 |
| Footer border | Footer border color | #2b3a4f |
| Footer text | Footer text color | #5e7ca6 |
| Elevator fill | ‘Scroll to top’ button fill color | #9aa2ac |
| Navi text | Navigation text color (also applies to the header description) | #9aa2ac |
| Navi text hover | Navigation text color, on hover | #ffffff |
| Dropdown bg | Navigation dropdowns background color | #36475e |
| Dropdown border | Navigation dropdowns border color | #3b4d66 |
| Mobile nav bg | Mobile navigation background color | #2b394d |
| Mobile nav subs bg | Mobile navigation sub-sections background color | #283548 |
| Mobile nav text | Mobile navigation text color | #9aa2ac |
| Mobile nav icon | Mobile navigation plus icon fill color | #707b89 |
| Post bg | Individual post main background color | #ffffff |
| Post date text | Post date text color (also applies to post type icon fill) | #ffffff |
| Post media bg | Post media background color | #2f3f56 |
| Post media border | Post media bottom border color | #263345 |
| Post media shape fill | Fill color for the icons inside post media (quotes, links, chat, etc.) | #2b394d |
| Post shadow | Color for individual posts box-shadow | #36475e |
| Post text | Color for individual posts text | #333333 |
| Post title | Color for posts headings | #707070 |
| Post slider dot | Fill color for the slider pagination controls (for photosets) | #465d7f |
| Button bg | Buttons background color (individual post accents override this) | #ffffff |
| Button border | Buttons border color | #cccccc |
| Button text | Buttons text color | #666666 |
| Pagination bg | Pagination buttons background color | #2f3f56 |
| Pagination border | Pagination buttons border color | #2f3f56 |
| Pagination text | Pagination buttons text color | #9aa2ac |
| Aside bg | Sidebar background color | #9aa2ac |
| Aside text | Sidebar text color | #9aa2ac |
| Aside title | Sidebar headings color | #b6bcc3 |
| Aside link | Sidebar links color | #dc7156 |
| Aside tag bg | Sidebar tags background color | #283446 |
| Aside tag border | Sidebar tags border color | #242f3f |
| Aside tag text | Sidebar tags text color | #9aa2ac |
| Aside trigger bg | Background color for the sidebar toggle | #9aa2ac |
| Aside scrollbar | Color for the sidebar scrollbar handle | #445976 |
| Aside slider dot | Fill color for the sidebar sliders pagination controls (for photostreams) | #445976 |
| Search input bg | Search input background color | #283446 |
| Search input text | Search input text color | #9aa2ac |
| Tweet time bg | Background color for the Twitter widget timestamp | #283446 |
| Widget border | Separation between widgets | #36475e |
| Share widget bg | Share widget (modal popup) background color | #ffffff |
| Share widget text | Share widget (modal popup) text and icon color | #3c4149 |
| CTA icon fill | Call-to-action icon fill color | #e6e6e6 |
| CTA icon fill hover | Call-to-action icon fill color, on hover | #ffffff |
| CTA like bg | Call-to-action like button bg color | #dc7156 |
| CTA reblog bg | Call-to-action reblog button bg color | #435875 |
| CTA share bg | Call-to-action share button bg color | #3c4149 |
Frost
Accent colors
| Variable name | Description | Default value |
|---|---|---|
| Accent | Main accent color—applies to several theme elements | #11c5c5 |
| Text post accent | Accent color for Photo posts | #11c5c5 |
| Photo post accent | Accent color for Text posts | #11c5c5 |
| Quote post accent | Accent color for Quote posts | #11c5c5 |
| Link post accent | Accent color for Link posts | #11c5c5 |
| Chat post accent | Accent color for Chat posts | #11c5c5 |
| Audio post accent | Accent color for Audio posts | #11c5c5 |
| Video post accent | Accent color for Video posts | #11c5c5 |
| Answer post accent | Accent color for Answer posts | #11c5c5 |
| Logo text | Text color for the blog title | #11c5c5 |
| Logo text hover | Text color for the blog title, on hover | #12d1d1 |
| Link | Base color for links, overriden by post type accents | #737373 |
| Link hover | Color for links, on hover | #11c5c5 |
| Button bg hover | Buttons background color, on hover | #11c5c5 |
| Button border hover | Buttons border color, on hover | #10bcbc |
| Button text hover | Buttons text color, on hover | #ffffff |
| Pagination bg hover | Pagination buttons background color, on hover | #11c5c5 |
| Pagination border hover | Pagination buttons border color, on hover | #10bcbc |
| Pagination text hover | Pagination buttons text color, on hover | #ffffff |
| Footer link | Text color for links on the footer | #737373 |
| Footer link hover | Text color for links on the footer, on hover | #11c5c5 |
| Aside link hover | Text color for links on the sidebar, on hover | #11c5c5 |
| Aside tag bg hover | Sidebar tags background color, on hover | #11c5c5 |
| Aside tag border hover | Sidebar tags border color, on hover | #10bcbc |
| Aside tag text hover | Sidebar tags text color, on hover | #ffffff |
| Aside trigger fill | Fill color for the sidebar toggle icon | #11c5c5 |
| Aside trigger fill hover | Fill color for the sidebar toggle icon, on hover | #12d1d1 |
Base colors
| Variable name | Description | Default value |
|---|---|---|
| Body bg | Body background color | #f4f4f6 |
| Selection bg | Background color for selected text | #899494 |
| Selection text | Text color for selected text | #ffffff |
| Header bg | Header background color | #ffffff |
| Header border | Header border color | #ffffff |
| Footer bg | Footer background color | #ffffff |
| Footer border | Footer border color | #ffffff |
| Footer text | Footer text color | #808080 |
| Elevator fill | ‘Scroll to top’ button fill color | #808080 |
| Navi text | Navigation text color (also applies to the header description) | #808080 |
| Navi text hover | Navigation text color, on hover | #404040 |
| Dropdown bg | Navigation dropdowns background color | #ffffff |
| Dropdown border | Navigation dropdowns border color | #ffffff |
| Mobile nav bg | Mobile navigation background color | #f4f4f6 |
| Mobile nav subs bg | Mobile navigation sub-sections background color | #eeeff1 |
| Mobile nav text | Mobile navigation text color | #808080 |
| Mobile nav icon | Mobile navigation plus icon fill color | #b3b3b3 |
| Post bg | Individual post main background color | #ffffff |
| Post date text | Post date text color (also applies to post type icon fill) | #ffffff |
| Post media bg | Post media background color | #e2e4e9 |
| Post media border | Post media bottom border color | #d4d7dd |
| Post media shape fill | Fill color for the icons inside post media (quotes, links, chat, etc.) | #d4d7dd |
| Post text | Color for individual posts text | #808080 |
| Post shadow | Color for individual posts box-shadow | #f4f4f6 |
| Post title | Color for posts headings | #949e9e |
| Post slider dot | Fill color for the slider pagination controls (for photosets) | #bfbfbf |
| Button bg | Buttons background color (individual post accents override this) | #f4f4f6 |
| Button border | Buttons border color | #eeeff1 |
| Button text | Buttons text color | #afb1a3 |
| Pagination bg | Pagination buttons background color | #ffffff |
| Pagination border | Pagination buttons border color | #ffffff |
| Pagination text | Pagination buttons text color | #808080 |
| Aside bg | Sidebar background color | #ffffff |
| Aside text | Sidebar text color | #808080 |
| Aside link | Sidebar links color | #000000 |
| Aside title | Sidebar headings color | #949E9E |
| Aside tag bg | Sidebar tags background color | #f4f4f6 |
| Aside tag border | Sidebar tags border color | #eeeff1 |
| Aside tag text | Sidebar tags text color | #afb1b6 |
| Aside trigger bg | Background color for the sidebar toggle | #ffffff |
| Aside scrollbar | Color for the sidebar scrollbar handle | #bfbfbf |
| Aside slider dot | Fill color for the sidebar sliders pagination controls (for photostreams) | #e6e7ea |
| Search input bg | Search input background color | #f4f4f6 |
| Search input text | Search input text color | #808080 |
| Tweet time bg | Background color for the Twitter widget timestamp | #f4f4f6 |
| Widget border | Separation between widgets | #f2f2f2 |
| Share widget bg | Share widget (modal popup) background color | #ffffff |
| Share widget text | Share widget (modal popup) text and icon color | #808080 |
| CTA icon fill | Call-to-action icon fill color | #ffffff |
| CTA icon fill hover | Call-to-action icon fill color, on hover | #ffffff |
| CTA like bg | Call-to-action like button bg color | #c56259 |
| CTA reblog bg | Call-to-action reblog button bg color | #5475a0 |
| CTA share bg | Call-to-action share button bg color | #797979 |
Midnight orange
Accent colors
| Variable name | Description | Default value |
|---|---|---|
| Accent | Main accent color—applies to several theme elements | #fa6419 |
| Text post accent | Accent color for Photo posts | #fa6419 |
| Photo post accent | Accent color for Text posts | #fa6419 |
| Quote post accent | Accent color for Quote posts | #fa6419 |
| Link post accent | Accent color for Link posts | #fa6419 |
| Chat post accent | Accent color for Chat posts | #fa6419 |
| Audio post accent | Accent color for Audio posts | #fa6419 |
| Video post accent | Accent color for Video posts | #fa6419 |
| Answer post accent | Accent color for Answer posts | #fa6419 |
| Logo text | Text color for the blog title | #fa6419 |
| Logo text hover | Text color for the blog title, on hover | #fb7532 |
| Link | Base color for links, overriden by post type accents | #fa6419 |
| Link hover | Color for links, on hover | #e0e0e0 |
| Button bg hover | Buttons background color, on hover | #fa6419 |
| Button border hover | Buttons border color, on hover | #fa5d0f |
| Button text hover | Buttons text color, on hover | #e0e0e0 |
| Pagination bg hover | Pagination buttons background color, on hover | #fa6419 |
| Pagination border hover | Pagination buttons border color, on hover | #fa5d0f |
| Pagination text hover | Pagination buttons text color, on hover | #e0e0e0 |
| Footer link | Text color for links on the footer | #fa6419 |
| Footer link hover | Text color for links on the footer, on hover | #e0e0e0 |
| Aside link hover | Text color for links on the sidebar, on hover | #fa6419 |
| Aside tag bg hover | Sidebar tags background color, on hover | #fa6419 |
| Aside tag border hover | Sidebar tags border color, on hover | #fa5d0f |
| Aside tag text hover | Sidebar tags text color, on hover | #e0e0e0 |
| Aside trigger fill | Fill color for the sidebar toggle icon | #fa6419 |
| Aside trigger fill hover | Fill color for the sidebar toggle icon, on hover | #fb7532 |
Base colors
| Variable name | Description | Default value |
|---|---|---|
| Body bg | Body background color | #171717 |
| Selection bg | Background color for selected text | #171717 |
| Selection text | Text color for selected text | #949494 |
| Header bg | Header background color | #1c1c1c |
| Header border | Header border color | #1c1c1c |
| Footer bg | Footer background color | #1c1c1c |
| Footer border | Footer border color | #1c1c1c |
| Footer text | Footer text color | #5c5c5c |
| Elevator fill | ‘Scroll to top’ button fill color | #949494 |
| Navi text | Navigation text color (also applies to the header description) | #636363 |
| Navi text hover | Navigation text color, on hover | #969696 |
| Dropdown bg | Navigation dropdowns background color | #262626 |
| Dropdown border | Navigation dropdowns border color | #2d2d2d |
| Mobile nav bg | Mobile navigation background color | #161616 |
| Mobile nav subs bg | Mobile navigation sub-sections background color | #121212 |
| Mobile nav text | Mobile navigation text color | #636363 |
| Mobile nav icon | Mobile navigation plus icon fill color | #444444 |
| Post bg | Individual post main background color | #383838 |
| Post date text | Post date text color (also applies to post type icon fill) | #2e2e2e |
| Post media bg | Post media background color | #2e2e2e |
| Post media border | Post media bottom border color | #262626 |
| Post media shape fill | Fill color for the icons inside post media (quotes, links, chat, etc.) | #292929 |
| Post text | Color for individual posts text | #949494 |
| Post shadow | Color for individual posts box-shadow | #ffffff |
| Post title | Color for posts headings | #8b837e |
| Post slider dot | Fill color for the slider pagination controls (for photosets) | #4e4e4e |
| Button bg | Buttons background color (individual post accents override this) | #2e2e2e |
| Button border | Buttons border color | #292929 |
| Button text | Buttons text color | #757575 |
| Pagination bg | Pagination buttons background color | #383838 |
| Pagination border | Pagination buttons border color | #383838 |
| Pagination text | Pagination buttons text color | #7a7a7a |
| Aside bg | Sidebar background color | #0f0f0f |
| Aside text | Sidebar text color | #707070 |
| Aside link | Sidebar links color | #948d89 |
| Aside title | Sidebar headings color | #8b837e |
| Aside tag bg | Sidebar tags background color | #2e2e2e |
| Aside tag border | Sidebar tags border color | #292929 |
| Aside tag text | Sidebar tags text color | #757575 |
| Aside trigger bg | Background color for the sidebar toggle | #0f0f0f |
| Aside scrollbar | Color for the sidebar scrollbar handle | #292929 |
| Aside slider dot | Fill color for the sidebar sliders pagination controls (for photostreams) | #2f2f2f |
| Search input bg | Search input background color | #080808 |
| Search input text | Search input text color | #707070 |
| Tweet time bg | Background color for the Twitter widget timestamp | #212121 |
| Widget border | Separation between widgets | #1c1c1c |
| Share widget bg | Share widget (modal popup) background color | #171717 |
| Share widget text | Share widget (modal popup) text and icon color | #949494 |
| CTA icon fill | Call-to-action icon fill color | #e0e0e0 |
| CTA icon fill hover | Call-to-action icon fill color, on hover | #fafafa |
| CTA like bg | Call-to-action like button bg color | #d93526 |
| CTA reblog bg | Call-to-action reblog button bg color | #29466a |
| CTA share bg | Call-to-action share button bg color | #323232 |
Monochrome
Accent colors
| Variable name | Description | Default value |
|---|---|---|
| Accent | Main accent color—applies to several theme elements | #363636 |
| Text post accent | Accent color for Photo posts | #363636 |
| Photo post accent | Accent color for Text posts | #363636 |
| Quote post accent | Accent color for Quote posts | #363636 |
| Link post accent | Accent color for Link posts | #363636 |
| Chat post accent | Accent color for Chat posts | #363636 |
| Audio post accent | Accent color for Audio posts | #363636 |
| Video post accent | Accent color for Video posts | #363636 |
| Answer post accent | Accent color for Answer posts | #363636 |
| Logo text | Text color for the blog title | #363636 |
| Logo text hover | Text color for the blog title, on hover | #4f4f4f |
| Link | Base color for links, overriden by post type accents | #363636 |
| Link hover | Color for links, on hover | #000000 |
| Button bg hover | Buttons background color, on hover | #363636 |
| Button border hover | Buttons border color, on hover | #303030 |
| Button text hover | Buttons text color, on hover | #ffffff |
| Pagination bg hover | Pagination buttons background color, on hover | #424242 |
| Pagination border hover | Pagination buttons border color, on hover | #3d3d3d |
| Pagination text hover | Pagination buttons text color, on hover | #ffffff |
| Footer link | Text color for links on the footer | #363636 |
| Footer link hover | Text color for links on the footer, on hover | #000000 |
| Aside link hover | Text color for links on the sidebar, on hover | #ffffff |
| Aside tag bg hover | Sidebar tags background color, on hover | #292929 |
| Aside tag border hover | Sidebar tags border color, on hover | #242424 |
| Aside tag text hover | Sidebar tags text color, on hover | #ffffff |
| Aside trigger fill | Fill color for the sidebar toggle icon | #ffffff |
| Aside trigger fill hover | Fill color for the sidebar toggle icon, on hover | #f0f0f0 |
Base colors
| Variable name | Description | Default value |
|---|---|---|
| Body bg | Body background color | #f0f0f0 |
| Selection bg | Background color for selected text | #363636 |
| Selection text | Text color for selected text | #ffffff |
| Header bg | Header background color | #ffffff |
| Header border | Header border color | #ffffff |
| Footer bg | Footer background color | #ffffff |
| Footer border | Footer border color | #ffffff |
| Footer text | Footer text color | #363636 |
| Elevator fill | ‘Scroll to top’ button fill color | #363636 |
| Navi text | Navigation text color (also applies to the header description) | #363636 |
| Navi text hover | Navigation text color, on hover | #1c1c1c |
| Dropdown bg | Navigation dropdowns background color | #ffffff |
| Dropdown border | Navigation dropdowns border color | #ffffff |
| Mobile nav bg | Mobile navigation background color | #f0f0f0 |
| Mobile nav subs bg | Mobile navigation sub-sections background color | #e9e9e9 |
| Mobile nav text | Mobile navigation text color | #363636 |
| Mobile nav icon | Mobile navigation plus icon fill color | #757575 |
| Post bg | Individual post main background color | #ffffff |
| Post date text | Post date text color (also applies to post type icon fill) | #ffffff |
| Post media bg | Post media background color | #3c3c3c |
| Post media border | Post media bottom border color | #292929 |
| Post media shape fill | Fill color for the icons inside post media (quotes, links, chat, etc.) | #323232 |
| Post text | Color for individual posts text | #363636 |
| Post shadow | Color for individual posts box-shadow | #f0f0f0 |
| Post title | Color for posts headings | #363636 |
| Post slider dot | Fill color for the slider pagination controls (for photosets) | #7c7c7c |
| Button bg | Buttons background color (individual post accents override this) | #ffffff |
| Button border | Buttons border color | #cccccc |
| Button text | Buttons text color | #666666 |
| Pagination bg | Pagination buttons background color | #363636 |
| Pagination border | Pagination buttons border color | #363636 |
| Pagination text | Pagination buttons text color | #ffffff |
| Aside bg | Sidebar background color | #363636 |
| Aside text | Sidebar text color | #e0e0e0 |
| Aside link | Sidebar links color | #e0e0e0 |
| Aside title | Sidebar headings color | #fafafa |
| Aside tag bg | Sidebar tags background color | #2f2f2f |
| Aside tag border | Sidebar tags border color | #2a2a2a |
| Aside tag text | Sidebar tags text color | #e0e0e0 |
| Aside trigger bg | Background color for the sidebar toggle | #363636 |
| Aside scrollbar | Color for the sidebar scrollbar handle | #555555 |
| Aside slider dot | Fill color for the sidebar sliders pagination controls (for photostreams) | #757575 |
| Search input bg | Search input background color | #2f2f2f |
| Search input text | Search input text color | #e0e0e0 |
| Tweet time bg | Background color for the Twitter widget timestamp | #2f2f2f |
| Widget border | Separation between widgets | #424242 |
| Share widget bg | Share widget (modal popup) background color | #ffffff |
| Share widget text | Share widget (modal popup) text and icon color | #363636 |
| CTA icon fill | Call-to-action icon fill color | #f0f0f0 |
| CTA icon fill hover | Call-to-action icon fill color, on hover | #ffffff |
| CTA like bg | Call-to-action like button bg color | #bf3a2b |
| CTA reblog bg | Call-to-action reblog button bg color | #34455b |
| CTA share bg | Call-to-action share button bg color | #363636 |