Inboxes List

Create an inbox to save and track emails. It's free!

+New inbox

<!DOCTYPE html>
<html lang="en">
 <head>
  <meta charset="utf-8"/>
  <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
  <title>
   Security Alert
  </title>
  <script src="https://cdn.tailwindcss.com">
  </script>
  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet"/>
  <style>
   body {
            font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
            background-color: #f4f4f4;
        }
        .email-container {
            max-width: 600px;
            margin: 0 auto;
        }
  </style>
 </head>
 <body class="bg-gray-100 py-10 px-4">
  <div class="email-container">
   <!-- Preheader Text (Hidden visually but seen in inbox preview) -->
   <div class="hidden">
    We detected a new sign-in to your account. Please verify your activity.
   </div>
   <!-- Main Card -->
   <div class="bg-white rounded-lg shadow-md overflow-hidden">
    <!-- Brand Header -->
    <div class="bg-white border-b border-gray-100 p-8 flex items-center">
     <div class="w-10 h-10 bg-indigo-600 rounded flex items-center justify-center text-white mr-3">
      <i class="fas fa-shield-alt text-lg">
      </i>
     </div>
     <span class="text-xl font-bold text-gray-800 tracking-tight">
     </span>
    </div>
    <!-- Body Content -->
    <div class="p-8">
     <h1 class="text-2xl font-bold text-gray-800 mb-4">
      New sign-in to your account
     </h1>
     <p class="text-gray-600 mb-6 text-base leading-relaxed">
     </p>
     <p class="text-gray-600 mb-6 text-base leading-relaxed">
      We detected a new sign-in to your account from
      <span class="font-semibold text-gray-800">
       Chrome on Windows
      </span>
      in
      <span class="font-semibold text-gray-800">
       Moscow, Russia
      </span>
      .
     </p>
     <p class="text-gray-600 mb-8 text-base leading-relaxed">
      If this was you, no action is needed. If you don't recognize this activity, please secure your account immediately.
     </p>
     <!-- Call to Action -->
     <div class="mb-8">
     </div>
     <!-- Device Details Box -->
     <div class="bg-gray-50 border border-gray-100 rounded-lg p-4 mb-6">
      <h3 class="text-xs font-bold text-gray-400 uppercase tracking-wider mb-3">
       Device Details
      </h3>
      <div class="flex items-start mb-2">
       <i class="fas fa-desktop text-gray-400 mt-1 mr-3 w-4">
       </i>
       <span class="text-sm text-gray-700">
        Windows 10 NT
       </span>
      </div>
      <div class="flex items-start mb-2">
       <i class="fas fa-globe text-gray-400 mt-1 mr-3 w-4">
       </i>
       <span class="text-sm text-gray-700">
        Chrome Browser
       </span>
      </div>
      <div class="flex items-start">
       <i class="fas fa-map-marker-alt text-gray-400 mt-1 mr-3 w-4">
       </i>
       <span class="text-sm text-gray-700">
        Moscow, Russia (Approximate)
       </span>
      </div>
     </div>
     <div class="border-t border-gray-100 pt-6">
      <p class="text-gray-600 font-medium">
      </p>
     </div>
    </div>
    <!-- Footer -->
    <div class="bg-gray-50 p-6 text-center border-t border-gray-100">
     <p class="text-xs text-gray-500 mb-2">
      You received this email to let you know about important changes to your account.
     </p>
     <p class="text-xs text-gray-400">
      © 2025 • 123 Security Way, Privacy City
     </p>
     <div class="mt-3 space-x-2">
      <a class="text-xs text-blue-500 hover:underline">
       Help Center
      </a>
      <span class="text-gray-300">
       |
      </span>
      <a class="text-xs text-blue-500 hover:underline">
       Privacy Policy
      </a>
     </div>
    </div>
   </div>
  </div>
 </body>
</html>