| <html> | |
| <head> | |
| <title>AI Output Detector</title> | |
| <a href="https://isitai.com/ai-text-detector/" target="_blank">AI Generated Text Detector</a> - <a href="https://isitai.com/ai-image-detector/" target="_blank">AI Generated Image Detector</a> | |
| <meta charset="utf-8"> | |
| <style type="text/css"> | |
| * { | |
| box-sizing: border-box; | |
| } | |
| body { | |
| font-family: sans-serif; | |
| margin: 0; | |
| background: #ffffff; | |
| } | |
| h1 { | |
| font-weight: lighter; | |
| } | |
| a { | |
| text-decoration: none; | |
| color: #666; | |
| } | |
| a:hover { | |
| text-decoration: underline; | |
| } | |
| #container { | |
| margin: auto; | |
| width: 100%; | |
| } | |
| #textbox { | |
| font-family: serif; | |
| font-size: 16pt; | |
| width: 100%; | |
| height: 480px; | |
| padding: 20px 30px; | |
| line-height: 1.6; | |
| } | |
| .bar-row { | |
| height: 30px; | |
| } | |
| #real-percentage { | |
| width: 80px; | |
| vertical-align: top; | |
| } | |
| #bar-container { | |
| width: 800px; | |
| background-color: #ff7674; | |
| line-height: 0.5; | |
| position:relative; | |
| top:6px; | |
| } | |
| #fake-percentage { | |
| width: 80px; | |
| vertical-align: top; | |
| } | |
| #bar { | |
| display: inline-block; | |
| height: 30px; | |
| background-color: #83aaff; | |
| } | |
| #submit-btn { | |
| display: block; | |
| margin: 20px auto; | |
| padding: 10px 20px; | |
| font-size: 16px; | |
| font-weight: bold; | |
| color: #fff; | |
| background-color: #007bff; | |
| border-radius: 5px; | |
| cursor: pointer; | |
| box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); | |
| } | |
| #submit-btn:hover { | |
| background-color: #0069d9; | |
| } | |
| #submit-btn:active { | |
| box-shadow: none; | |
| transform: translateY(2px); | |
| } | |
| #checking-message:after { | |
| content: "."; | |
| animation: dots 1s steps(5, end) infinite; | |
| } | |
| @keyframes dots { | |
| 0%, 20% { | |
| color: rgba(0, 0, 0, 0); | |
| text-shadow: | |
| .25em 0 0 rgba(0, 0, 0, 0), | |
| .5em 0 0 rgba(0, 0, 0, 0); | |
| } | |
| 40% { | |
| color: black; | |
| text-shadow: | |
| .25em 0 0 rgba(0, 0, 0, 0), | |
| .5em 0 0 rgba(0, 0, 0, 0); | |
| } | |
| 60% { | |
| text-shadow: | |
| .25em 0 0 black, | |
| .5em 0 0 rgba(0, 0, 0, 0); | |
| } | |
| 80%, 100% { | |
| text-shadow: | |
| .25em 0 0 black, | |
| .5em 0 0 black; | |
| } | |
| } | |
| em { | |
| font-family: monospace; | |
| font-style: normal; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="container"> | |
| <form> | |
| <textarea id="textbox" placeholder="Enter text here"></textarea> | |
| <button id="submit-btn" type="submit">Check Text</button> | |
| </form> | |
| <div align=center style="width:100%;"><table cellspacing="0" cellpadding="0"> | |
| <tr class="bar-row" style="vertical-align: bottom;"> | |
| <td style="text-align: left;">Human</td> | |
| <td id="message" style="text-align: center;"></td> | |
| <td style="text-align: right;">AI</td> | |
| </tr> | |
| <tr class="bar-row"> | |
| <td id="real-percentage" style="text-align: left; vertical-align: bottom;"></td> | |
| <td id="bar-container"><div id="bar" style="width: 50%;"></div></td> | |
| <td id="fake-percentage" style="text-align: right; vertical-align: bottom;"></td> | |
| </tr> | |
| </table></div> | |
| </div> | |
| <script src="https://isitai.com/scripts/txt.js"></script> | |
| </body> | |
| </html> |