Terminal

Developer
Haeman
Size
3,250 Kb
Views
38,456
  1. Terminal Previews
  2. Terminal HTML Codes
  3. Terminal CSS Codes
  4. Terminal JS Codes

How do I make an terminal?

The terminal with CSS3. What is a terminal? How do you make a terminal? This script and codes were developed by Haeman on 29 August 2022, Monday.

Terminal Previews
IQ Test

Terminal - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Terminal</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! */ @import url(http://fonts.googleapis.com/css?family=Open+Sans);
html{ height:100%
}
body{ background: -webkit-linear-gradient(45deg, #7db4d2 0%,#aeb6c9 100%); background: -moz-linear-gradient(45deg, #7db4d2 0%,#aeb6c9 100%);	background: -o-linear-gradient(45deg, #7db4d2 0%,#aeb6c9 100%);
}
.prp{	background: #f76b50;	width: 12px;	height: 12px;	display: block;	border-radius: 100%;	box-shadow: 0px 1px 5px #853222 inset,0px 1px 0px rgba(255,255,255,0.5);	float: left;	margin:0px 5px;
}
.prp:before{	content: '';	border-radius: 100%;	width: 7px;	height: 3px;	background: transparent;	position: absolute;	margin: -3px 3px;	box-shadow: 0px 5px 3px white;
}
.prp:after{	content: '';	border-radius: 100%;	width: 10px;	height: 4px;	background: transparent;	position: absolute;	margin: 2px 1px;	box-shadow: 0px 5px 6px white;
}
.min{	background: #f5bf67;	box-shadow: 0px 1px 5px #876212 inset,0px 1px 0px rgba(255,255,255,0.5);
}
.max{	background: #a3db82;	box-shadow: 0px 1px 5px #5a6e49 inset,0px 1px 0px rgba(255,255,255,0.5);
}
.header{	background: -webkit-linear-gradient(top, #e5e5e5 0%,#bababa 100%, #bababa 100%);	background: -moz-linear-gradient(top, #e5e5e5 0%,#bababa 100%, #bababa 100%);	background: -o-linear-gradient(top, #e5e5e5 0%,#bababa 100%, #bababa 100%);	border-radius: 5px 5px 0px 0px;	border-bottom: 1px solid #888;	height: 13px;	padding:5px;	box-shadow: 0px 1px 2px rgba(0,0,0,0.1);
}
.window{	margin:0px auto;	margin-top: 20px;	width: 500px;	border:1px solid #888;	background: #222220;	border-radius: 7px 7px 5px 5px;	min-height: 300px;	box-shadow: 0px 5px 20px rgba(0,0,0,0.3);
}
.maxer{	font-size: 20px;	color:#8D8D8D;	text-shadow:0px 1px 0px #fff;	text-decoration: none;	-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg);	display: block;	float: right;	line-height: 14px;
}
.header span{	display: block;	text-align: center;	color:#000;	font-size: 11px;	text-shadow:0px 1px 0px #fff;	font-family: "Open Sans", Sans-serif;	padding: 0px 50px;	line-height: 13px;
}
.window pre{	color:#fff;	margin:3px;
} </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
</head>
<body> <body> <div class='window'>	<div class='header'>	<a href="#" class='prp close'></a>	<a href="#" class='prp min'></a>	<a href="#" class='prp max'></a>	<a href="#" class='maxer'>&#8660;</a>	<span>Terminal - Bash - 50x30</span>	</div>	<pre>
Last login : Fri May 25 15:00:23 on ttyp1
Welcome to Darwin!
Martabakk:~/usr gosong$	</pre>	</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Terminal - Script Codes CSS Codes

@import url(http://fonts.googleapis.com/css?family=Open+Sans);
html{ height:100%
}
body{ background: -webkit-linear-gradient(45deg, #7db4d2 0%,#aeb6c9 100%); background: -moz-linear-gradient(45deg, #7db4d2 0%,#aeb6c9 100%);	background: -o-linear-gradient(45deg, #7db4d2 0%,#aeb6c9 100%);
}
.prp{	background: #f76b50;	width: 12px;	height: 12px;	display: block;	border-radius: 100%;	box-shadow: 0px 1px 5px #853222 inset,0px 1px 0px rgba(255,255,255,0.5);	float: left;	margin:0px 5px;
}
.prp:before{	content: '';	border-radius: 100%;	width: 7px;	height: 3px;	background: transparent;	position: absolute;	margin: -3px 3px;	box-shadow: 0px 5px 3px white;
}
.prp:after{	content: '';	border-radius: 100%;	width: 10px;	height: 4px;	background: transparent;	position: absolute;	margin: 2px 1px;	box-shadow: 0px 5px 6px white;
}
.min{	background: #f5bf67;	box-shadow: 0px 1px 5px #876212 inset,0px 1px 0px rgba(255,255,255,0.5);
}
.max{	background: #a3db82;	box-shadow: 0px 1px 5px #5a6e49 inset,0px 1px 0px rgba(255,255,255,0.5);
}
.header{	background: -webkit-linear-gradient(top, #e5e5e5 0%,#bababa 100%, #bababa 100%);	background: -moz-linear-gradient(top, #e5e5e5 0%,#bababa 100%, #bababa 100%);	background: -o-linear-gradient(top, #e5e5e5 0%,#bababa 100%, #bababa 100%);	border-radius: 5px 5px 0px 0px;	border-bottom: 1px solid #888;	height: 13px;	padding:5px;	box-shadow: 0px 1px 2px rgba(0,0,0,0.1);
}
.window{	margin:0px auto;	margin-top: 20px;	width: 500px;	border:1px solid #888;	background: #222220;	border-radius: 7px 7px 5px 5px;	min-height: 300px;	box-shadow: 0px 5px 20px rgba(0,0,0,0.3);
}
.maxer{	font-size: 20px;	color:#8D8D8D;	text-shadow:0px 1px 0px #fff;	text-decoration: none;	-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg);	display: block;	float: right;	line-height: 14px;
}
.header span{	display: block;	text-align: center;	color:#000;	font-size: 11px;	text-shadow:0px 1px 0px #fff;	font-family: "Open Sans", Sans-serif;	padding: 0px 50px;	line-height: 13px;
}
.window pre{	color:#fff;	margin:3px;
}

Terminal - Script Codes JS Codes

//Im not MacOSX User, if some element is not correct please informed
//Actually im Ubuntu User :)
Terminal - Script Codes
Terminal - Script Codes
Home Page Home
Developer Haeman
Username pedox
Uploaded August 29, 2022
Rating 3
Size 3,250 Kb
Views 38,456
Do you need developer help for Terminal?

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!

Haeman (pedox) Script Codes
Name
Loading Hourglass
Thin Google Homepage
Twitter info
WhatsApp Logo Pure CSS3
Google Metro Flatten
The Rainbow
Custom Select Checkbox
Handbook CSS3
Windows 8 metro UI
Commuter Line Tokyu 8500
Create amazing sales emails 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!