├── README.md ├── index (1).html └── style.css /README.md: -------------------------------------------------------------------------------- 1 | ![image](https://github.com/VamikaSheel/File-encryption-AES-Algorithm/assets/43423469/b69a6ec3-49b5-4721-b8d7-fe21ff635949) 2 | ![image](https://github.com/VamikaSheel/File-encryption-AES-Algorithm/assets/43423469/62304d88-17cd-4d27-b155-6a64e12133c0) 3 | -------------------------------------------------------------------------------- /index (1).html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Web Browser Based File Encryption / Decryption 6 | 7 | 8 | 9 | 10 | 11 |
12 |

File Encryption & Decryption Using AES Algorithm

13 | 14 |
15 |

16 | 17 | 18 | 19 |

20 |
21 |
22 | 23 |
24 |

Encrypt a File

25 |

Enter a password and drop the file to be encrypted into the dropzone below. The file will then be encrypted using the password, then you'll be given an opportunity to save the encrypted file to your system.

26 | 27 | 28 |
29 |
30 |
31 |
32 |
Password
33 |
34 | 35 |
36 |
(minumum length eight characters, make sure it strong!) 37 |
38 |
39 |
40 |
Password (retype)
41 |
42 |
43 |
44 |
45 |
46 | 47 |

48 | 49 |
50 |
51 |

Drag and drop the file to be encrypted into this dropzone, or click here to select file.

52 |

53 |
54 | 55 |
56 | 57 |

58 | 59 |
60 |
61 |
62 |
63 |
64 |
65 |
66 |
67 |
68 | 69 | 70 |

71 | 72 |
73 | 74 |
75 | 76 |

77 |
78 | 79 |
80 |

Decrypt a File

81 |

Decrypt a file using the password that was previously used to encrypt the file. After the file is decrypted, you'll be given an opportunity to save the decrypted file to your system.

82 | 83 |
84 |
85 |
86 |
87 |
Password
88 |
89 |
90 |
91 |
92 | 93 |

94 | 95 |
96 |
97 |

Drag and drop file to be decrypted into this dropzone, or click here to select file.

98 |

99 |
100 | 101 |
102 | 103 |

104 | 105 |
106 |
107 |
108 |
109 |
110 |
111 |
112 |
113 | 114 |

115 | 116 |
117 | 118 |
119 |
120 |

121 |
122 | 123 | 124 | 125 | 126 | 370 | 371 | 372 | -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #ffffff; 3 | } 4 | 5 | .btn { 6 | background-color: #a15eb6; 7 | border: #a15eb6; 8 | } 9 | .btn:hover { 10 | background-color: #562b63; 11 | } 12 | 13 | .btn[disabled] 14 | { 15 | background-color: #504154; 16 | } 17 | 18 | .btn:active:hover { 19 | background-color:#32193a; 20 | } 21 | 22 | a { 23 | color: #7d169c; 24 | text-decoration: none; 25 | font-weight: bold; 26 | } 27 | a:hover { 28 | text-decoration: underline; 29 | } 30 | 31 | .top { 32 | margin: 20px auto; 33 | max-width: 800px; 34 | } 35 | 36 | h1 { 37 | margin: 50px; 38 | } 39 | 40 | .divTableCell { 41 | margin-bottom: 30px; 42 | } 43 | 44 | #divEncryptfile, #divDecryptfile { 45 | margin-top: 50px; 46 | width: 700px; 47 | margin: 50px auto; 48 | border-radius: 20px; 49 | padding: 30px; 50 | background-color: #e8bff5; 51 | } 52 | 53 | .fieldLabel { 54 | font-weight: bold; 55 | margin-bottom: 10px; 56 | } 57 | 58 | .form { 59 | margin-bottom: 10px; 60 | max-width: 400px; 61 | border-radius: 20px; 62 | padding: 40px; 63 | margin: 0px auto; 64 | } 65 | 66 | #btnDecrypt, #btnEncrypt { 67 | width: 100%; 68 | margin-top: 50px; 69 | } 70 | 71 | input[type="password"] { 72 | width: 100%; 73 | } --------------------------------------------------------------------------------