A Material 1 style for DuckDuckGo. It can be themed to look like Google, Bing, Yahoo, and more.
Material 1 for DuckDuckGo by lightbeam

Details
Authorlightbeam
LicenseNo License
Categoryduckduckgo
Created
Updated
Code size6.0 kB
Code checksum2a9b9c6b
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
1.0.0 - 2023/09/24
Initial release
Source code
/* ==UserStyle==
@name Material 1 for DuckDuckGo
@namespace github.com/openstyles/stylus
@version 1.0.0
@description A Material 1 style for DuckDuckGo. It can be themed to look like Google, Bing, Yahoo, and more.
@author lightbeam24
@preprocessor stylus
@var select theme "Theme" ["ddg:DuckDuckGo", "google:Google", "bing:Bing", "bing2:Bing (Classic)", "yahoo:Yahoo", "x:X", "x2:X (Classic)"]
==/UserStyle== */
@-moz-document domain("duckduckgo.com") {
html {
--material-orange: #de5833;
--material-orange-2: #ea977f;
--material-orange-2: #e79174;
--material-green: #085;
--material-green-2: #0b7;
--material-purple: #5f00d2;
--material-purple-2: #9946ff;
--material-black: #000;
--material-black-2: #333;
--material-blue: #1da1f2;
--material-blue-2: #67c5ff;
--bing-blue: #2962e8;
--bing-blue-2: #3691f8;
--bing-teal: #008173;
--bing-teal-2: #1fb5a5;
}
if theme == ddg {
html {
--mbg1: var(--material-orange);
--mbg2: var(--material-orange-2);
}
}
if theme == bing {
html {
--mbg1: var(--bing-blue);
--mbg2: var(--bing-blue-2);
}
.is-link-style-exp .header__logo {
filter: grayscale(1) brightness(1000);
}
.header__logo {
background-image: url("https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fnews.thewindowsclub.com%2Fwp-content%2Fuploads%2F2020%2F10%2FBing-Logo.png&f=1&nofb=1&ipt=3bf7a24e7a3120bbb02721dac63e2a6be20ba737429ef2b63fe56956b19f53dd&ipo=images") !important;
}
}
if theme == bing2 {
html {
--mbg1: var(--bing-teal);
--mbg2: var(--bing-teal-2);
}
.is-link-style-exp .header__logo {
width: 114px;
height: 84px;
background-size: 114px 84px;
filter: grayscale(1) brightness(1000);
margin-left: 32px;
}
.header__logo {
background-image: url("https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fcdn.freebiesupply.com%2Flogos%2Fthumbs%2F1x%2Fbing-11-logo.png&f=1&nofb=1&ipt=ff3c90687ee8623ce85aeba931e5a8b49ebf75efcc9fa0c4811bab0e1a626c68&ipo=images") !important;
}
}
if theme == google {
html {
--mbg1: var(--material-green);
--mbg2: var(--material-green-2);
}
.is-link-style-exp .header__logo {
width: 92px;
height: 30px;
background-size: 92px 30px;
filter: grayscale(1) brightness(1000);
margin-top: 2px;
}
.header__logo {
background-image: url("https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fi.stack.imgur.com%2F3CEBV.png&f=1&nofb=1&ipt=d7caad68be3116048381a46716eae29476964982197a6c186479ae1ca894e0c3&ipo=images") !important;
}
}
if theme == yahoo {
html {
--mbg1: var(--material-purple);
--mbg2: var(--material-purple-2);
}
.is-link-style-exp .header__logo {
width: 110px;
height: 30.5px;
background-size: 110px 30.5px;
filter: grayscale(1) brightness(1000);
max-width: none;
min-width: 110px !important;
margin-right: 22px;
margin-top: 4px;
}
.header__logo {
background-image: url("https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fupload.wikimedia.org%2Fwikipedia%2Fcommons%2Fthumb%2F3%2F3a%2FYahoo!_(2019).svg%2F440px-Yahoo!_(2019).svg.png&f=1&nofb=1&ipt=b153c5d58c258a2c6ae2e6f2ceeff00684b20cf459a62283795b9919da67582b&ipo=images") !important;
}
}
if theme == x {
html {
--mbg1: var(--material-black);
--mbg2: var(--material-black-2);
}
.is-link-style-exp .header__logo {
width: 60px;
height: 60px;
background-size: 60px 60px;
max-width: none;
margin-right: 22px;
margin-top: 1px;
}
.header__logo {
background-image: url("https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fnews.topusainsights.com%2Fwp-content%2Fuploads%2F2023%2F07%2Ftwitter-x-logo.jpg&f=1&nofb=1&ipt=526c6a02567bcdc79861bf1c7c6bd4f54ac574b490e77d5e9bc117abbf2e6b62&ipo=images") !important;
}
}
if theme == x2 {
html {
--mbg1: var(--material-blue);
--mbg2: var(--material-blue-2);
}
.is-link-style-exp .header__logo {
width: 47px;
height: 38px;
background-size: 47px 38px;
max-width: none;
margin-right: 22px;
margin-top: 0px;
filter: grayscale(1) brightness(1000);
}
.header__logo {
background-image: url("https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2F3.bp.blogspot.com%2F-xrCmYR9EE0E%2FWmWY0Tj9nfI%2FAAAAAAAAA7s%2F8o6m0M_KvCgOgprbVvXTdGpU3zdqMCc7ACLcBGAs%2Fs1600%2FTwitter_bird_logo.png&f=1&nofb=1&ipt=3acaa4461c5d77eb9d079de5d50ba11be4f4f3cb77c9cfe2dcaa81c9137eff5b&ipo=images") !important;
}
}
#header_wrapper {
background: var(--mbg1);
box-shadow: 0 1px 6px rgba(0,0,0,.35);
transition: background 0.5s;
}
#search_form {
background: var(--mbg2);
border: none;
border-radius: 0;
box-shadow: none;
transition: background 0.5s;
}
.search__clear,
#search_form_input {
color: #fff !important;
}
.search__button,
.search__button--hero {
color: #fff !important;
border-radius: 0;
background: none !important;
}
.header__button--menu {
color: #fff !important;
}
.header__label, .header__link {
color: #fff !important;
}
/* tabs */
.zcm-wrap--header {
margin-left: -7px;
}
.zcm__link {
padding: 0 10px;
padding-bottom: 0px;
text-transform: uppercase;
font-weight: bold;
color: white !important;
}
.zcm__link.is-active {
border-color: white !important;
}
/* image detail */
.detail--xd {
background-color: var(--mbg1);
transition: background 0.5s;
}
.c-detail__title__sub, .c-detail__desc, .c-detail__filemeta, .c-detail__more {
color: #fff;
}
.detail--xd .c-detail__btn {
background-color: white;
border-color: transparent;
color: var(--mbg1);
font-weight: bold;
text-transform: uppercase;
border-radius: 2px !important;
display: inline-block;
vertical-align: middle;
padding: 4px 20px;
font-size: 15px;
box-shadow: 0 3px 6px rgba(0,0,0,.35);
transition: color 0.5s;
}
}