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
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57<!DOCTYPE html>
<html lang="ko">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Base64 λμ½λ© μΈμ½λ© | Base64 μνΈν 볡νΈν - Base64.kr</title>
<meta name="keywords" content="Base64, Base64 μΈμ½λ©, Base64 λμ½λ©, Base64 μνΈν, Base64 볡νΈν" />
<meta name="description"
content="Base64 νμμ λ°μ΄ν°λ₯Ό λμ½λ©ν΄ 보μΈμ. λλ λ€μν κ³ κΈ μ΅μ
μ μ¬μ©νμ¬ μΈμ½λ©λ ν΄λ³΄μΈμ. μ ν¬ μ¬μ΄νΈμλ μ¨λΌμΈ λ°μ΄ν° λ³ν λκ΅¬κ° κ°νΈνκ² μ¬μ©ν μ μμ΅λλ€.">
<link rel="icon" href="image/base64-16.png" sizes="16x16" type="image/png">
<link rel="icon" href="image/base64-32.png" sizes="32x32" type="image/png">
<link rel="icon" href="image/base64.png" sizes="64x64" type="image/png">
<link rel="canonical" href="https://base64.kr" />
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
</head>
<body class="bg-gray-50">
<header class="head-bg text-white py-2 pl-4 pr-4 md:pl-20 md:pr-20">
<h1 class="text-left text-xl font-bold"><a href="https://base64.kr">Base64.kr</a></h1>
<div class="flex space-x-2 justify-end">
<a class="text-white hover:text-gray-300 font-bold" href="https://base64.kr">νκ΅μ΄</a>
<a class="text-white hover:text-gray-300" href="https://base64.kr/zh">δΈζ</a>
<a class="text-white hover:text-gray-300" href="https://base64.kr/en">English</a>
</div>
</header>
<div class="text-slate-900 bg-white p-6">
<h1 class="text-3xl font-bold text-center">Base64 λμ½λ© μΈμ½λ©</h1>
</div>
<main class="px-4 py-4 flex justify-center">
<div class="custom-container w-full sm:w-full md:w-1/2 max-w-900 bg-white p-6 rounded-lg shadow-md">
<textarea id="inputText"
class="w-full h-40 sm:h-30 mb-4 p-2 resize-y border rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
placeholder="Base64λ‘ μΈμ½λ© λλ λμ½λ©ν λ¬Έμλ₯Ό μ
λ ₯νμΈμ."></textarea>
<h3 class="mb-4 text-gray-500">Base64 μΈμ½λ© λλ λμ½λ©λ κ²°κ³ΌοΌ</h3>
<textarea id="outputText"
class="w-full h-40 sm:h-30 p-2 border-0 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 bg-blue-50 text-blue-700"
placeholder="" readonly></textarea>
<div id="copyDiv"
class="bg-blue-50 text-blue-700 text-left rounded-lg p-2 flex items-center justify-center space-x-2">
<span id="copyBtn">Copy</span>
</div>
<div class="flex justify-center mt-4">
<button id="decodeBtn"
class="mr-2 px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none text-base sm:text-sm">λμ½λ©</button>
<button id="encodeBtn"
class="mr-2 px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-indigo-600 focus:outline-none text-base sm:text-sm">μΈμ½λ©</button>
<button id="swapBtn"
class="px-4 py-2 bg-gray-100 text-black rounded-md hover:bg-blue-50 focus:outline-none text-base sm:text-sm">κ΅ν</button>
</div>
</div>
</main>
<div class="bg-gray-100 text-gray-500 text-center rounded-lg p-2 text-sm mt-60">
μ¨λΌμΈ Base64 λμ½λ©μΈμ½λ©λꡬ Copyright Β© <span class="text-blue-700">base64.kr</span>
</div>
<script src="script.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="style.css">
</body>
</html>