Duotone Fixed Backgrounds

Developer
Kendrick Arnett
Size
7,732 Kb
Views
32,384
  1. Duotone Fixed Backgrounds Previews
  2. Duotone Fixed Backgrounds HTML Codes
  3. Duotone Fixed Backgrounds CSS Codes

How do I make an duotone fixed backgrounds?

What is a duotone fixed backgrounds? How do you make a duotone fixed backgrounds? This script and codes were developed by Kendrick Arnett on 11 August 2022, Thursday.

Duotone Fixed Backgrounds Previews
IQ Test

Duotone Fixed Backgrounds - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Duotone Fixed Backgrounds</title> <style>
@import 'https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600';
@import 'https://fonts.googleapis.com/css?family=Crimson+Text';
body { font-family: 'Open Sans';
}
</style> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel='stylesheet prefetch' href='css/rlgxqp.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body>
<main class="cd-main-content"> <div class="cd-fixed-bg"> <div class="cd-bg-1"></div> <div class="adjust"></div> <div class="words"> <quote>Alternate Fixed &amp; Scrolling Backgrounds</quote> </div> </div> <div class="cd-scrolling-bg cd-color-2"> <div class="cd-container"> <p>Hearts of the stars the ash of stellar alchemy, tesseract colonies rich in heavy atoms take root and flourish preserve and cherish that pale blue dot at the edge of forever, great turbulent clouds, dispassionate extraterrestrial observer rich in mystery, realm of the galaxies, cosmic ocean billions upon billions intelligent beings cosmic ocean great turbulent clouds tesseract qui dolorem ipsum quia dolor sit amet Euclid, brain is the seed of intelligence?</p> <p>Billions upon billions explorations, Apollonius of Perga the sky calls to us. Hydrogen atoms, inconspicuous motes of rock and gas? Finite but unbounded laws of physics science. Quasar dream of the mind's eye, permanence of the stars ship of the imagination eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit citizens of distant epochs finite but unbounded! White dwarf courage of our questions Hypatia a billion trillion, courage of our questions cosmic ocean the only home we've ever known, prime number, the only home we've ever known Vangelis totam rem aperiam.</p> </div> </div> <div class="cd-fixed-bg"> <div class="cd-bg-2"></div> <div class="adjust"></div> <div class="words"> <quote>Design is the silent ambassador of your brand.</quote> </div> </div> <div class="cd-scrolling-bg cd-color-3"> <div class="cd-container"> <p>Rogue circumnavigated realm of the galaxies, encyclopaedia galactica white dwarf, quasar. Star stuff harvesting star light two ghostly white figures in coveralls and helmets are soflty dancing. Not a sunrise but a galaxyrise take root and flourish a mote of dust suspended in a sunbeam great turbulent clouds explorations, take root and flourish across the centuries muse about billions upon billions cosmos, inconspicuous motes of rock and gas hundreds of thousands, the sky calls to us lorem ipsum dolor sit amet network of wormholes Flatland rogue, the only home we've ever known, rich in mystery. A mote of dust suspended in a sunbeam from which we spring.</p> <p>Paroxysm of global death. Cosmos, muse about. Consciousness quasar, rich in heavy atoms, Cambrian explosion, globular star cluster a billion trillion another world, a billion trillion, a still more glorious dawn awaits shores of the cosmic ocean hundreds of thousands colonies Hypatia consectetur dispassionate extraterrestrial observer extraordinary claims require extraordinary evidence venture. Courage of our questions, dispassionate extraterrestrial observer cosmic ocean preserve and cherish that pale blue dot quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident something incredible is waiting to be known.</p> </div> </div> <div class="cd-fixed-bg"> <div class="cd-bg-3"></div> <div class="adjust"></div> <div class="words"> <quote>Making the simple complicated is commonplace; making the complicated simple, awesomely simple, that’s creativity.</quote> </div> </div> <div class="cd-scrolling-bg cd-color-1"> <div class="cd-container"> <p>White dwarf network of wormholes. Quasar quis nostrum exercitationem ullam corporis suscipit laboriosam, as a patch of light consectetur adipisicing elit sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, with pretty stories for which there's little good evidence Drake Equation! How far away, cosmos realm of the galaxies intelligent beings with pretty stories for which there's little good evidence, radio telescope, inconspicuous motes of rock and gas, a billion trillion, across the centuries. Paroxysm of global death rich in heavy atoms, circumnavigated great turbulent clouds nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur Sea of Tranquility.</p> <p>Hundreds of thousands. Permanence of the stars decipherment hundreds of thousands, of brilliant syntheses at the edge of forever colonies sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam Euclid. Descended from astronomers. Of brilliant syntheses. Take root and flourish hearts of the stars finite but unbounded vanquish the impossible not a sunrise but a galaxyrise laws of physics billions upon billions, prime number, cosmos Rig Veda. Bits of moving fluff Hypatia, corpus callosum! The sky calls to us totam rem aperiam.</p> </div> </div> <div class="cd-fixed-bg"> <div class="cd-bg-4"></div> <div class="adjust"></div> <div class="words"> <quote>Bad design shouts at you. Good design is the silent seller.</quote> </div> </div>
</main>
</body>
</html>

Duotone Fixed Backgrounds - Script Codes CSS Codes

html * { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
body, html { height: 100%;
}
quote { font-size: 3.875rem; font-style: italic; max-width: 50%; font-weight: 100; text-shadow: 0 0 3px black;
}
.cd-container { width: 90%; max-width: 768px; margin: 0 auto;
}
.cd-container::after { content: ''; display: table; clear: both;
}
.cd-main-content { height: 100%; position: relative; z-index: 1;
}
.cd-fixed-bg { position: relative; min-height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center center; background-size: cover; z-index: 1;
}
.words { color: white; position: absolute; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; top: 0; bottom: 0; left: 0; right: 0; z-index: 2; background-image: -webkit-linear-gradient(top left, rgba(10, 104, 157, 0.1), rgba(20, 217, 190, 0.15)); background-image: linear-gradient(to bottom right, rgba(10, 104, 157, 0.1), rgba(20, 217, 190, 0.15));
}
.adjust { position: absolute; height: 100%; top: 0; left: 0; bottom: 0; right: 0;
}
.adjust::before, .adjust::after { position: absolute; content: ''; top: 0; left: 0; bottom: 0; right: 0; pointer-events: none;
}
.adjust::before { z-index: 1; background: #822a94; mix-blend-mode: exclusion;
}
.adjust::after { z-index: 2; background: #0d35ff; mix-blend-mode: difference;
}
.cd-bg-1 { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #0a689d; background-image: url("http://www.pixelstalk.net/wp-content/uploads/2016/10/Download-Free-Apollo-Wallpaper.jpg"); background-blend-mode: screen; background-attachment: fixed; background-position: 20% 40%; background-size: cover; -webkit-filter: grayscale(1) contrast(0.9) brightness(0.8); filter: grayscale(1) contrast(0.9) brightness(0.8); z-index: 1;
}
.cd-bg-2 { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #0a689d; background-image: url("https://i.ytimg.com/vi/SM2KWCMrOYw/maxresdefault.jpg"); background-blend-mode: screen; background-attachment: fixed; background-size: cover; -webkit-filter: grayscale(1) contrast(0.9) brightness(0.8); filter: grayscale(1) contrast(0.9) brightness(0.8); z-index: 1;
}
.cd-bg-3 { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #0a689d; background-image: url("http://spacelists.com/wp-content/uploads/wallpaper-of-nasa-93407150.jpg"); background-blend-mode: screen; background-attachment: fixed; background-position: 50% 50%; background-size: cover; -webkit-filter: grayscale(1) contrast(0.9) brightness(0.8); filter: grayscale(1) contrast(0.9) brightness(0.8);
}
.cd-bg-4 { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #0a689d; background-image: url("https://s-media-cache-ak0.pinimg.com/originals/d0/09/ff/d009ff7de2fa0be69e58beed99c33b68.jpg"); background-blend-mode: screen; background-attachment: fixed; background-position: 50% 40%; background-size: cover; -webkit-filter: grayscale(1) contrast(0.9) brightness(0.8); filter: grayscale(1) contrast(0.9) brightness(0.8);
}
h1.words, h2.words { margin: 0;
}
.cd-fixed-bg { background-attachment: fixed;
}
.cd-scrolling-bg { position: relative; min-height: 100%; padding: 4em 0; line-height: 1.6; box-shadow: 0 2px 50px 0 rgba(0, 0, 0, 0.5); z-index: 2; background-color: #fafefe; color: #0a0e0e;
}
Duotone Fixed Backgrounds - Script Codes
Duotone Fixed Backgrounds - Script Codes
Home Page Home
Developer Kendrick Arnett
Username kendrick
Uploaded August 11, 2022
Rating 3
Size 7,732 Kb
Views 32,384
Do you need developer help for Duotone Fixed Backgrounds?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Kendrick Arnett (kendrick) Script Codes
Name
Grid With 2-Up Skyscrapers
Flexbox Resume Challenge
A Pen by Kendrick Arnett
SVG Social Icons
Pulse for Skeleton Screens
Include-media Include
Reasonably Shadowed Button
Colors
Linkish Buttons
Chunky Toggles
Create amazing blog posts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!