STAR WARS Title

Developer
Raichu26
Size
3,390 Kb
Views
12,144
  1. STAR WARS Title Previews
  2. STAR WARS Title HTML Codes
  3. STAR WARS Title CSS Codes

How do I make an star wars title?

Super famous Star Wars title recreated in css. I use perspective and transform properties to achieve this effect.. What is a star wars title? How do you make a star wars title? This script and codes were developed by Raichu26 on 29 November 2022, Tuesday.

STAR WARS Title Previews
IQ Test

STAR WARS Title - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>STAR WARS Title</title> <style> /* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */ // View it in full page mode.
html {height:100%;}
body {
background:#000; overflow:hidden; background:url(https://i.imgur.com/mDODa.gif?1); animation: stars 122s infinite linear;
}
.perspective { width:100%; height:100%; perspective:2000;
}
.title {color:#64d4fb;}
h1 {text-align:center;}
h2 { text-align:center;
}
article {
position:absolute;
top:390px;
left:50%;
display:block;
font-family:'helvetica neue';
color:#E9C660;
width:500px;
text-align:justify;
font-size:1.5em;
margin-left:-250px;
line-height:1.5em;
letter-spacing:.2em;
transform:rotatex(40deg);
animation: textMove 60s linear infinite;
}
img { position:absolute;	top:50%; left:50%; margin-left:-500px; margin-top:-234px;	z-index:1000; transform-origin: center center; animation: sw 13s forwards;	}
@keyframes textMove {	to {top:-2000px;}
}
@keyframes stars { from {background-position: 5% 5%} to{background-position: 1300% 5%}
}
@keyframes sw {	to {transform:scale(0);}
} </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
</head>
<body> <img src="https://i.imgur.com/Uia4i.png?1"/>
<div class="perspective">
<article> <br><br><br><br><br><br><br> <br><br><br><br><br><br><br> <h1>Episode IV</h1>
<h2>A NEW HOPE</h2>
<p>
It's just mind-blowingly awesome. I apologize, and I wish I was more articulate, but it's hard to be articulate when your mind's blown—but in a very good way.<br><br>
It has been said that astronomy is a humbling and character-building experience. There is perhaps no better demonstration of the folly of human conceits than this distant image of our tiny world. To me, it underscores our responsibility to deal more kindly with one another, and to preserve and cherish the pale blue dot, the only home we've ever known.<br><br>
From this day forward, Flight Control will be known by two words: 'Tough' and 'Competent.' Tough means we are forever accountable for what we do or what we fail to do. We will never again compromise our responsibilities. Every time we walk into Mission Control we will know what we stand for. Competent means we will never take anything for granted. We will never be found short in our knowledge and in our skills. Mission Control will be perfect. When you leave this meeting today you will go to your office and the first thing you will do there is to write 'Tough and Competent' on your blackboards. It will never be erased. Each day when you enter the room these words will remind you of the price paid by Grissom, White, and Chaffee. These words are the price of admission to the ranks of Mission Control.<br><br>
Let's light this fire one more time, Mike, and witness this great nation at its best.<br><br><br><br><br><br><br><br><br><br><br><br><br><br></p>
</article>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
</body>
</html>

STAR WARS Title - Script Codes CSS Codes

// View it in full page mode.
html {height:100%;}
body {
background:#000; overflow:hidden; background:url(https://i.imgur.com/mDODa.gif?1); animation: stars 122s infinite linear;
}
.perspective { width:100%; height:100%; perspective:2000;
}
.title {color:#64d4fb;}
h1 {text-align:center;}
h2 { text-align:center;
}
article {
position:absolute;
top:390px;
left:50%;
display:block;
font-family:'helvetica neue';
color:#E9C660;
width:500px;
text-align:justify;
font-size:1.5em;
margin-left:-250px;
line-height:1.5em;
letter-spacing:.2em;
transform:rotatex(40deg);
animation: textMove 60s linear infinite;
}
img { position:absolute;	top:50%; left:50%; margin-left:-500px; margin-top:-234px;	z-index:1000; transform-origin: center center; animation: sw 13s forwards;	}
@keyframes textMove {	to {top:-2000px;}
}
@keyframes stars { from {background-position: 5% 5%} to{background-position: 1300% 5%}
}
@keyframes sw {	to {transform:scale(0);}
}
STAR WARS Title - Script Codes
STAR WARS Title - Script Codes
Home Page Home
Developer Raichu26
Username alemesre
Uploaded November 29, 2022
Rating 3
Size 3,390 Kb
Views 12,144
Do you need developer help for STAR WARS Title?

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!

Raichu26 (alemesre) Script Codes
Name
Zelda Loader
Knob rotation
CSS RAIN
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!