-
Notifications
You must be signed in to change notification settings - Fork 6
/
Copy pathindex.html
37 lines (34 loc) · 1.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Rgba to hex/rgb converter</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="header">
<div class="content">
<h1>Converter for rgba/hsla-colors into hexadecimal-value.</h1>
</div>
</div>
<div class="content">
<p>To use this converter, enter the rgba(R, G, B, A) or hsla(H, S, L, A) string into the first input field and the hexadecimal color of the background into the second input field.</p>
<p>It is also possible to enter an rgb or hsl definition for the background.</p>
<form>
<label>
Foreground color:
<input type="text" name="rgba" id="rgba" placeholder="rgba(R, G, B, A) or hsla(H, S, L, A)" title="Format: rgba(R, G, B, A)" required/>
</label><br/>
<label>
Background color:
<input type="text" name="background" id="background" placeholder="#AABBCC or rgb(R, G, B) or hsl(H, S, L)" title="Format: #AABBCC or #ABC"/>
</label>
<button type="submit">Calculate</button>
</form>
<div id="resultcontainer">
<div id="result"></div>
</div>
</div>
<script src="logic.js"></script>
</body>
</html>