|
<!DOCTYPE html> |
|
<html lang="en"> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
<title>Malware Variant Correlation Agent</title> |
|
<script src="https://cdn.tailwindcss.com"></script> |
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script> |
|
<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script> |
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
<style> |
|
.sidebar { |
|
transition: all 0.3s ease; |
|
} |
|
.graph-container { |
|
height: 600px; |
|
background-color: #1a202c; |
|
border-radius: 0.5rem; |
|
} |
|
.malware-card:hover { |
|
transform: translateY(-5px); |
|
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2); |
|
} |
|
.timeline-item:not(:last-child)::after { |
|
content: ''; |
|
position: absolute; |
|
left: 11px; |
|
top: 24px; |
|
height: 100%; |
|
width: 2px; |
|
background: #4a5568; |
|
} |
|
.code-viewer { |
|
font-family: 'Courier New', monospace; |
|
font-size: 0.875rem; |
|
} |
|
.draggable-node { |
|
cursor: move; |
|
} |
|
.tabs-container .tab-content { |
|
display: none; |
|
} |
|
.tabs-container .tab-content.active { |
|
display: block; |
|
} |
|
</style> |
|
</head> |
|
<body class="bg-gray-900 text-gray-200"> |
|
<div class="flex h-screen overflow-hidden"> |
|
|
|
<div class="sidebar w-64 bg-gray-800 text-gray-200 flex-shrink-0"> |
|
<div class="p-4 border-b border-gray-700"> |
|
<h1 class="text-xl font-bold flex items-center"> |
|
<i class="fas fa-shield-virus mr-2 text-blue-400"></i> |
|
<span>MalwareCorrelator</span> |
|
</h1> |
|
<p class="text-xs text-gray-400 mt-1">Variant Correlation Agent v2.1</p> |
|
</div> |
|
<div class="p-4"> |
|
<div class="mb-6"> |
|
<h2 class="text-sm font-semibold text-gray-400 uppercase tracking-wider mb-2">Analysis</h2> |
|
<ul> |
|
<li class="mb-1"> |
|
<a href="#" class="flex items-center px-3 py-2 rounded bg-gray-700 text-blue-300"> |
|
<i class="fas fa-project-diagram mr-2"></i> |
|
<span>Variant Mapping</span> |
|
</a> |
|
</li> |
|
<li class="mb-1"> |
|
<a href="#" class="flex items-center px-3 py-2 rounded hover:bg-gray-700"> |
|
<i class="fas fa-fingerprint mr-2"></i> |
|
<span>IOC Correlation</span> |
|
</a> |
|
</li> |
|
<li class="mb-1"> |
|
<a href="#" class="flex items-center px-3 py-2 rounded hover:bg-gray-700"> |
|
<i class="fas fa-route mr-2"></i> |
|
<span>TTP Analysis</span> |
|
</a> |
|
</li> |
|
<li class="mb-1"> |
|
<a href="#" class="flex items-center px-3 py-2 rounded hover:bg-gray-700"> |
|
<i class="fas fa-history mr-2"></i> |
|
<span>Evolution Timeline</span> |
|
</a> |
|
</li> |
|
</ul> |
|
</div> |
|
<div class="mb-6"> |
|
<h2 class="text-sm font-semibold text-gray-400 uppercase tracking-wider mb-2">Threat Intelligence</h2> |
|
<ul> |
|
<li class="mb-1"> |
|
<a href="#" class="flex items-center px-3 py-2 rounded hover:bg-gray-700"> |
|
<i class="fas fa-database mr-2"></i> |
|
<span>Malware Database</span> |
|
</a> |
|
</li> |
|
<li class="mb-1"> |
|
<a href="#" class="flex items-center px-3 py-2 rounded hover:bg-gray-700"> |
|
<i class="fas fa-user-secret mr-2"></i> |
|
<span>Threat Actors</span> |
|
</a> |
|
</li> |
|
<li class="mb-1"> |
|
<a href="#" class="flex items-center px-3 py-2 rounded hover:bg-gray-700"> |
|
<i class="fas fa-flag mr-2"></i> |
|
<span>Campaigns</span> |
|
</a> |
|
</li> |
|
</ul> |
|
</div> |
|
<div> |
|
<h2 class="text-sm font-semibold text-gray-400 uppercase tracking-wider mb-2">Tools</h2> |
|
<ul> |
|
<li class="mb-1"> |
|
<a href="#" class="flex items-center px-3 py-2 rounded hover:bg-gray-700"> |
|
<i class="fas fa-search mr-2"></i> |
|
<span>Sample Search</span> |
|
</a> |
|
</li> |
|
<li class="mb-1"> |
|
<a href="#" class="flex items-center px-3 py-2 rounded hover:bg-gray-700"> |
|
<i class="fas fa-file-export mr-2"></i> |
|
<span>Report Generator</span> |
|
</a> |
|
</li> |
|
<li class="mb-1"> |
|
<a href="#" class="flex items-center px-3 py-2 rounded hover:bg-gray-700"> |
|
<i class="fas fa-cog mr-2"></i> |
|
<span>Settings</span> |
|
</a> |
|
</li> |
|
</ul> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="flex-1 overflow-auto"> |
|
|
|
<header class="bg-gray-800 border-b border-gray-700 p-4 flex justify-between items-center"> |
|
<div class="flex items-center"> |
|
<button class="mr-4 text-gray-400 hover:text-white"> |
|
<i class="fas fa-bars"></i> |
|
</button> |
|
<h2 class="text-lg font-semibold">Malware Variant Correlation Dashboard</h2> |
|
</div> |
|
<div class="flex items-center space-x-4"> |
|
<div class="relative"> |
|
<input type="text" placeholder="Search samples, IOCs..." |
|
class="bg-gray-700 rounded-full py-2 px-4 pl-10 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 w-64"> |
|
<i class="fas fa-search absolute left-3 top-2.5 text-gray-400"></i> |
|
</div> |
|
<button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md text-sm font-medium flex items-center"> |
|
<i class="fas fa-plus mr-2"></i> |
|
<span>New Analysis</span> |
|
</button> |
|
<div class="w-8 h-8 rounded-full bg-gray-700 flex items-center justify-center"> |
|
<i class="fas fa-user"></i> |
|
</div> |
|
</div> |
|
</header> |
|
|
|
|
|
<main class="p-6"> |
|
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-6 mb-6"> |
|
<div class="bg-gray-800 rounded-lg p-4 border-l-4 border-blue-500"> |
|
<div class="flex justify-between items-start"> |
|
<div> |
|
<p class="text-sm text-gray-400">Analyzed Samples</p> |
|
<h3 class="text-2xl font-bold">12,847</h3> |
|
</div> |
|
<i class="fas fa-file-code text-blue-400 text-xl"></i> |
|
</div> |
|
<p class="text-xs text-gray-400 mt-2">+124 new today</p> |
|
</div> |
|
<div class="bg-gray-800 rounded-lg p-4 border-l-4 border-green-500"> |
|
<div class="flex justify-between items-start"> |
|
<div> |
|
<p class="text-sm text-gray-400">Identified Families</p> |
|
<h3 class="text-2xl font-bold">328</h3> |
|
</div> |
|
<i class="fas fa-sitemap text-green-400 text-xl"></i> |
|
</div> |
|
<p class="text-xs text-gray-400 mt-2">+3 new this week</p> |
|
</div> |
|
<div class="bg-gray-800 rounded-lg p-4 border-l-4 border-purple-500"> |
|
<div class="flex justify-between items-start"> |
|
<div> |
|
<p class="text-sm text-gray-400">Active Campaigns</p> |
|
<h3 class="text-2xl font-bold">47</h3> |
|
</div> |
|
<i class="fas fa-flag text-purple-400 text-xl"></i> |
|
</div> |
|
<p class="text-xs text-gray-400 mt-2">2 new campaigns detected</p> |
|
</div> |
|
<div class="bg-gray-800 rounded-lg p-4 border-l-4 border-yellow-500"> |
|
<div class="flex justify-between items-start"> |
|
<div> |
|
<p class="text-sm text-gray-400">Threat Actors</p> |
|
<h3 class="text-2xl font-bold">89</h3> |
|
</div> |
|
<i class="fas fa-user-secret text-yellow-400 text-xl"></i> |
|
</div> |
|
<p class="text-xs text-gray-400 mt-2">5 new attributions</p> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-6"> |
|
|
|
<div class="lg:col-span-2 bg-gray-800 rounded-lg p-4"> |
|
<div class="flex justify-between items-center mb-4"> |
|
<h3 class="font-semibold">Malware Variant Relationship Map</h3> |
|
<div class="flex space-x-2"> |
|
<button class="bg-gray-700 hover:bg-gray-600 px-3 py-1 rounded text-sm"> |
|
<i class="fas fa-expand mr-1"></i> Fullscreen |
|
</button> |
|
<button class="bg-gray-700 hover:bg-gray-600 px-3 py-1 rounded text-sm"> |
|
<i class="fas fa-download mr-1"></i> Export |
|
</button> |
|
</div> |
|
</div> |
|
<div class="graph-container rounded-lg" id="relationshipGraph"> |
|
|
|
<div class="flex items-center justify-center h-full"> |
|
<div class="text-center"> |
|
<i class="fas fa-project-diagram text-4xl text-gray-600 mb-2"></i> |
|
<p class="text-gray-400">Loading variant relationship visualization...</p> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 rounded-lg p-4"> |
|
<div class="flex justify-between items-center mb-4"> |
|
<h3 class="font-semibold">Selected Sample Details</h3> |
|
<span class="bg-red-500 text-white text-xs px-2 py-1 rounded">Malicious</span> |
|
</div> |
|
<div class="space-y-4"> |
|
<div> |
|
<p class="text-sm text-gray-400">Sample Hash</p> |
|
<p class="font-mono text-sm bg-gray-900 p-2 rounded">a1b2c3d4e5f6...7890</p> |
|
</div> |
|
<div> |
|
<p class="text-sm text-gray-400">File Type</p> |
|
<p>Windows PE Executable (64-bit)</p> |
|
</div> |
|
<div> |
|
<p class="text-sm text-gray-400">First Seen</p> |
|
<p>2023-05-15 14:32:10 UTC</p> |
|
</div> |
|
<div> |
|
<p class="text-sm text-gray-400">Malware Family</p> |
|
<div class="flex items-center"> |
|
<span class="bg-blue-900 text-blue-200 px-2 py-1 rounded text-xs mr-2">TrickBot</span> |
|
<span class="text-xs text-gray-400">(92% confidence)</span> |
|
</div> |
|
</div> |
|
<div> |
|
<p class="text-sm text-gray-400">Associated Campaign</p> |
|
<div class="flex items-center"> |
|
<span class="bg-purple-900 text-purple-200 px-2 py-1 rounded text-xs mr-2">Operation Cobalt Strike</span> |
|
<span class="text-xs text-gray-400">(87% confidence)</span> |
|
</div> |
|
</div> |
|
<div> |
|
<p class="text-sm text-gray-400">Threat Actor</p> |
|
<div class="flex items-center"> |
|
<span class="bg-yellow-900 text-yellow-200 px-2 py-1 rounded text-xs mr-2">Wizard Spider</span> |
|
<span class="text-xs text-gray-400">(78% confidence)</span> |
|
</div> |
|
</div> |
|
<div class="pt-4 border-t border-gray-700"> |
|
<p class="text-sm text-gray-400 mb-2">Similarity Scores</p> |
|
<div class="space-y-2"> |
|
<div> |
|
<div class="flex justify-between text-xs mb-1"> |
|
<span>Sample XZ-124 (TrickBot)</span> |
|
<span>94%</span> |
|
</div> |
|
<div class="w-full bg-gray-700 rounded-full h-2"> |
|
<div class="bg-blue-500 h-2 rounded-full" style="width: 94%"></div> |
|
</div> |
|
</div> |
|
<div> |
|
<div class="flex justify-between text-xs mb-1"> |
|
<span>Sample AB-789 (BazarLoader)</span> |
|
<span>82%</span> |
|
</div> |
|
<div class="w-full bg-gray-700 rounded-full h-2"> |
|
<div class="bg-blue-400 h-2 rounded-full" style="width: 82%"></div> |
|
</div> |
|
</div> |
|
<div> |
|
<div class="flex justify-between text-xs mb-1"> |
|
<span>Sample CD-456 (Ryuk)</span> |
|
<span>67%</span> |
|
</div> |
|
<div class="w-full bg-gray-700 rounded-full h-2"> |
|
<div class="bg-blue-300 h-2 rounded-full" style="width: 67%"></div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 rounded-lg mb-6"> |
|
<div class="tabs-container"> |
|
<div class="flex border-b border-gray-700"> |
|
<button class="tab-button px-4 py-3 font-medium text-sm border-b-2 border-blue-500 text-blue-400" data-tab="ttp">TTP Analysis</button> |
|
<button class="tab-button px-4 py-3 font-medium text-sm text-gray-400 hover:text-white" data-tab="ioc">IOC Correlation</button> |
|
<button class="tab-button px-4 py-3 font-medium text-sm text-gray-400 hover:text-white" data-tab="timeline">Evolution Timeline</button> |
|
<button class="tab-button px-4 py-3 font-medium text-sm text-gray-400 hover:text-white" data-tab="code">Code Similarity</button> |
|
</div> |
|
|
|
|
|
<div id="ttp" class="tab-content active p-4"> |
|
<h4 class="font-semibold mb-4">Tactics, Techniques, and Procedures (MITRE ATT&CK Framework)</h4> |
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4"> |
|
<div> |
|
<h5 class="text-sm font-medium text-gray-400 mb-2">Common TTPs Across Related Samples</h5> |
|
<div class="bg-gray-900 rounded-lg p-3"> |
|
<div class="mb-3"> |
|
<div class="flex items-center mb-1"> |
|
<span class="bg-red-500 text-white text-xs px-2 py-0.5 rounded mr-2">Tactic</span> |
|
<span class="font-medium">Execution</span> |
|
</div> |
|
<ul class="text-sm space-y-1 ml-8"> |
|
<li class="flex items-center"> |
|
<span class="w-2 h-2 bg-blue-400 rounded-full mr-2"></span> |
|
<span>Command-Line Interface (T1059)</span> |
|
<span class="ml-auto text-xs text-gray-400">92% match</span> |
|
</li> |
|
<li class="flex items-center"> |
|
<span class="w-2 h-2 bg-blue-400 rounded-full mr-2"></span> |
|
<span>Windows Management Instrumentation (T1047)</span> |
|
<span class="ml-auto text-xs text-gray-400">87% match</span> |
|
</li> |
|
</ul> |
|
</div> |
|
<div class="mb-3"> |
|
<div class="flex items-center mb-1"> |
|
<span class="bg-purple-500 text-white text-xs px-2 py-0.5 rounded mr-2">Tactic</span> |
|
<span class="font-medium">Persistence</span> |
|
</div> |
|
<ul class="text-sm space-y-1 ml-8"> |
|
<li class="flex items-center"> |
|
<span class="w-2 h-2 bg-blue-400 rounded-full mr-2"></span> |
|
<span>Registry Run Keys (T1547.001)</span> |
|
<span class="ml-auto text-xs text-gray-400">95% match</span> |
|
</li> |
|
<li class="flex items-center"> |
|
<span class="w-2 h-2 bg-blue-400 rounded-full mr-2"></span> |
|
<span>Scheduled Task (T1053)</span> |
|
<span class="ml-auto text-xs text-gray-400">83% match</span> |
|
</li> |
|
</ul> |
|
</div> |
|
<div> |
|
<div class="flex items-center mb-1"> |
|
<span class="bg-yellow-500 text-white text-xs px-2 py-0.5 rounded mr-2">Tactic</span> |
|
<span class="font-medium">Defense Evasion</span> |
|
</div> |
|
<ul class="text-sm space-y-1 ml-8"> |
|
<li class="flex items-center"> |
|
<span class="w-2 h-2 bg-blue-400 rounded-full mr-2"></span> |
|
<span>Process Injection (T1055)</span> |
|
<span class="ml-auto text-xs text-gray-400">89% match</span> |
|
</li> |
|
<li class="flex items-center"> |
|
<span class="w-2 h-2 bg-blue-400 rounded-full mr-2"></span> |
|
<span>Obfuscated Files (T1027)</span> |
|
<span class="ml-auto text-xs text-gray-400">91% match</span> |
|
</li> |
|
</ul> |
|
</div> |
|
</div> |
|
</div> |
|
<div> |
|
<h5 class="text-sm font-medium text-gray-400 mb-2">TTP Heatmap Across Variants</h5> |
|
<div class="bg-gray-900 rounded-lg p-4"> |
|
<canvas id="ttpHeatmap" height="300"></canvas> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div id="ioc" class="tab-content p-4"> |
|
<h4 class="font-semibold mb-4">Indicator of Compromise Correlation</h4> |
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6"> |
|
<div> |
|
<h5 class="text-sm font-medium text-gray-400 mb-2">Shared IOCs</h5> |
|
<div class="bg-gray-900 rounded-lg p-3"> |
|
<div class="mb-4"> |
|
<div class="flex items-center mb-2"> |
|
<i class="fas fa-globe mr-2 text-blue-400"></i> |
|
<span class="font-medium">Domains</span> |
|
</div> |
|
<ul class="text-sm space-y-1"> |
|
<li class="flex items-center justify-between bg-gray-800 p-2 rounded"> |
|
<span class="font-mono">malware-c2[.]com</span> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">5 variants</span> |
|
</li> |
|
<li class="flex items-center justify-between bg-gray-800 p-2 rounded"> |
|
<span class="font-mono">download-update[.]net</span> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">3 variants</span> |
|
</li> |
|
<li class="flex items-center justify-between bg-gray-800 p-2 rounded"> |
|
<span class="font-mono">secure-payment[.]xyz</span> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">2 variants</span> |
|
</li> |
|
</ul> |
|
</div> |
|
<div class="mb-4"> |
|
<div class="flex items-center mb-2"> |
|
<i class="fas fa-server mr-2 text-blue-400"></i> |
|
<span class="font-medium">IP Addresses</span> |
|
</div> |
|
<ul class="text-sm space-y-1"> |
|
<li class="flex items-center justify-between bg-gray-800 p-2 rounded"> |
|
<span class="font-mono">185.143.223.47</span> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">4 variants</span> |
|
</li> |
|
<li class="flex items-center justify-between bg-gray-800 p-2 rounded"> |
|
<span class="font-mono">91.234.56.178</span> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">3 variants</span> |
|
</li> |
|
</ul> |
|
</div> |
|
<div> |
|
<div class="flex items-center mb-2"> |
|
<i class="fas fa-file-signature mr-2 text-blue-400"></i> |
|
<span class="font-medium">File Hashes</span> |
|
</div> |
|
<ul class="text-sm space-y-1"> |
|
<li class="flex items-center justify-between bg-gray-800 p-2 rounded"> |
|
<span class="font-mono">a1b2c3...7890 (DLL)</span> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">3 variants</span> |
|
</li> |
|
<li class="flex items-center justify-between bg-gray-800 p-2 rounded"> |
|
<span class="font-mono">x7y8z9...1234 (EXE)</span> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">2 variants</span> |
|
</li> |
|
</ul> |
|
</div> |
|
</div> |
|
</div> |
|
<div> |
|
<h5 class="text-sm font-medium text-gray-400 mb-2">IOC Timeline</h5> |
|
<div class="bg-gray-900 rounded-lg p-4"> |
|
<div id="iocTimelineChart" style="height: 300px;"></div> |
|
</div> |
|
<div class="mt-4"> |
|
<h5 class="text-sm font-medium text-gray-400 mb-2">YARA Rule Matches</h5> |
|
<div class="bg-gray-900 rounded-lg p-3"> |
|
<div class="flex items-center justify-between mb-2"> |
|
<span class="text-sm font-medium">TrickBot v4 Loader</span> |
|
<span class="text-xs bg-green-900 text-green-200 px-2 py-0.5 rounded">98% match</span> |
|
</div> |
|
<div class="flex items-center justify-between mb-2"> |
|
<span class="text-sm font-medium">BazarBackdoor C2</span> |
|
<span class="text-xs bg-green-900 text-green-200 px-2 py-0.5 rounded">87% match</span> |
|
</div> |
|
<div class="flex items-center justify-between"> |
|
<span class="text-sm font-medium">Ryuk Encryption</span> |
|
<span class="text-xs bg-yellow-900 text-yellow-200 px-2 py-0.5 rounded">72% match</span> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div id="timeline" class="tab-content p-4"> |
|
<h4 class="font-semibold mb-4">Malware Family Evolution Timeline</h4> |
|
<div class="bg-gray-900 rounded-lg p-4"> |
|
<div class="timeline-container"> |
|
<div class="timeline-item relative pl-8 pb-6"> |
|
<div class="absolute left-0 top-0 w-6 h-6 rounded-full bg-blue-500 flex items-center justify-center"> |
|
<i class="fas fa-code text-xs text-white"></i> |
|
</div> |
|
<div class="bg-gray-800 rounded-lg p-3"> |
|
<div class="flex justify-between items-start"> |
|
<div> |
|
<h5 class="font-medium">TrickBot v1.0</h5> |
|
<p class="text-xs text-gray-400">2016-10-15</p> |
|
</div> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">Initial Version</span> |
|
</div> |
|
<p class="text-sm mt-1">First observed banking Trojan with web injects and form grabbing capabilities.</p> |
|
</div> |
|
</div> |
|
<div class="timeline-item relative pl-8 pb-6"> |
|
<div class="absolute left-0 top-0 w-6 h-6 rounded-full bg-blue-500 flex items-center justify-center"> |
|
<i class="fas fa-plus text-xs text-white"></i> |
|
</div> |
|
<div class="bg-gray-800 rounded-lg p-3"> |
|
<div class="flex justify-between items-start"> |
|
<div> |
|
<h5 class="font-medium">TrickBot v2.4</h5> |
|
<p class="text-xs text-gray-400">2017-05-22</p> |
|
</div> |
|
<span class="text-xs bg-purple-900 text-purple-200 px-2 py-0.5 rounded">Modular Update</span> |
|
</div> |
|
<p class="text-sm mt-1">Added modular architecture with plugin support for extended functionality.</p> |
|
</div> |
|
</div> |
|
<div class="timeline-item relative pl-8 pb-6"> |
|
<div class="absolute left-0 top-0 w-6 h-6 rounded-full bg-blue-500 flex items-center justify-center"> |
|
<i class="fas fa-network-wired text-xs text-white"></i> |
|
</div> |
|
<div class="bg-gray-800 rounded-lg p-3"> |
|
<div class="flex justify-between items-start"> |
|
<div> |
|
<h5 class="font-medium">TrickBot v3.1</h5> |
|
<p class="text-xs text-gray-400">2018-11-07</p> |
|
</div> |
|
<span class="text-xs bg-yellow-900 text-yellow-200 px-2 py-0.5 rounded">Lateral Movement</span> |
|
</div> |
|
<p class="text-sm mt-1">Incorporated worm-like spreading capabilities and SMB propagation.</p> |
|
</div> |
|
</div> |
|
<div class="timeline-item relative pl-8"> |
|
<div class="absolute left-0 top-0 w-6 h-6 rounded-full bg-blue-500 flex items-center justify-center"> |
|
<i class="fas fa-bolt text-xs text-white"></i> |
|
</div> |
|
<div class="bg-gray-800 rounded-lg p-3"> |
|
<div class="flex justify-between items-start"> |
|
<div> |
|
<h5 class="font-medium">TrickBot v4.2</h5> |
|
<p class="text-xs text-gray-400">2020-03-18</p> |
|
</div> |
|
<span class="text-xs bg-red-900 text-red-200 px-2 py-0.5 rounded">Ransomware</span> |
|
</div> |
|
<p class="text-sm mt-1">Integrated with Ryuk ransomware for double extortion attacks.</p> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div id="code" class="tab-content p-4"> |
|
<h4 class="font-semibold mb-4">Code Similarity Analysis</h4> |
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6"> |
|
<div> |
|
<h5 class="text-sm font-medium text-gray-400 mb-2">Fuzzy Hashing Comparison</h5> |
|
<div class="bg-gray-900 rounded-lg p-4"> |
|
<canvas id="similarityChart" height="250"></canvas> |
|
</div> |
|
<div class="mt-4"> |
|
<h5 class="text-sm font-medium text-gray-400 mb-2">Shared Code Fragments</h5> |
|
<div class="bg-gray-800 rounded-lg p-3"> |
|
<div class="flex justify-between items-center mb-2"> |
|
<span class="text-sm font-medium">Encryption Routine</span> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">91% match</span> |
|
</div> |
|
<div class="flex justify-between items-center mb-2"> |
|
<span class="text-sm font-medium">C2 Communication</span> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">87% match</span> |
|
</div> |
|
<div class="flex justify-between items-center"> |
|
<span class="text-sm font-medium">Persistence Mechanism</span> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">83% match</span> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
<div> |
|
<h5 class="text-sm font-medium text-gray-400 mb-2">Code Comparison Viewer</h5> |
|
<div class="bg-gray-900 rounded-lg overflow-hidden"> |
|
<div class="flex bg-gray-800 text-sm"> |
|
<div class="w-1/2 p-2 font-medium border-r border-gray-700">Current Sample</div> |
|
<div class="w-1/2 p-2 font-medium">Related Sample (TrickBot v3.1)</div> |
|
</div> |
|
<div class="code-viewer grid grid-cols-2 divide-x divide-gray-700"> |
|
<div class="p-2 overflow-auto max-h-64"> |
|
<pre class="text-gray-300"><code>void encryptFiles(string path) { |
|
for (auto &entry : fs::directory_iterator(path)) { |
|
if (entry.is_directory()) { |
|
encryptFiles(entry.path()); |
|
} else { |
|
auto file = entry.path(); |
|
if (isValidTarget(file)) { |
|
RSAEncrypt(file); |
|
rename(file, file += ".encrypted"); |
|
} |
|
} |
|
} |
|
}</code></pre> |
|
</div> |
|
<div class="p-2 overflow-auto max-h-64"> |
|
<pre class="text-gray-300"><code>void encryptFiles(string path) { |
|
for (auto &entry : fs::directory_iterator(path)) { |
|
if (entry.is_directory()) { |
|
encryptFiles(entry.path()); |
|
} else { |
|
auto file = entry.path(); |
|
if (shouldEncrypt(file)) { |
|
RSAEncrypt(file); |
|
rename(file, file += ".locked"); |
|
} |
|
} |
|
} |
|
}</code></pre> |
|
</div> |
|
</div> |
|
<div class="bg-gray-800 p-2 text-xs text-gray-400"> |
|
<i class="fas fa-info-circle mr-1 text-blue-400"></i> Highlighted code shows 91% similarity in encryption routines |
|
</div> |
|
</div> |
|
<div class="mt-4"> |
|
<h5 class="text-sm font-medium text-gray-400 mb-2">Import Address Table (IAT) Comparison</h5> |
|
<div class="bg-gray-900 rounded-lg p-3"> |
|
<div class="grid grid-cols-3 gap-2 text-xs mb-2 font-medium"> |
|
<div>Function</div> |
|
<div class="text-center">Current</div> |
|
<div class="text-center">Related</div> |
|
</div> |
|
<div class="space-y-2"> |
|
<div class="grid grid-cols-3 gap-2 items-center"> |
|
<div class="text-sm">CreateProcessW</div> |
|
<div class="bg-gray-800 p-1 rounded text-center">✓</div> |
|
<div class="bg-gray-800 p-1 rounded text-center">✓</div> |
|
</div> |
|
<div class="grid grid-cols-3 gap-2 items-center"> |
|
<div class="text-sm">RegSetValueEx</div> |
|
<div class="bg-gray-800 p-1 rounded text-center">✓</div> |
|
<div class="bg-gray-800 p-1 rounded text-center">✓</div> |
|
</div> |
|
<div class="grid grid-cols-3 gap-2 items-center"> |
|
<div class="text-sm">WSASend</div> |
|
<div class="bg-gray-800 p-1 rounded text-center">✓</div> |
|
<div class="bg-gray-800 p-1 rounded text-center">✓</div> |
|
</div> |
|
<div class="grid grid-cols-3 gap-2 items-center"> |
|
<div class="text-sm">CryptEncrypt</div> |
|
<div class="bg-gray-800 p-1 rounded text-center">✓</div> |
|
<div class="bg-gray-800 p-1 rounded text-center">✓</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 rounded-lg p-4 mb-6"> |
|
<div class="flex justify-between items-center mb-4"> |
|
<h3 class="font-semibold">Related Malware Samples</h3> |
|
<div class="flex items-center space-x-2"> |
|
<span class="text-xs text-gray-400">Sort by:</span> |
|
<select class="bg-gray-700 border border-gray-600 text-sm rounded px-2 py-1"> |
|
<option>Similarity Score</option> |
|
<option>First Seen</option> |
|
<option>Campaign</option> |
|
<option>Threat Actor</option> |
|
</select> |
|
</div> |
|
</div> |
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4"> |
|
<div class="malware-card bg-gray-900 rounded-lg p-4 border border-gray-700 transition duration-300"> |
|
<div class="flex justify-between items-start mb-2"> |
|
<div> |
|
<h4 class="font-medium">TrickBot v3.1</h4> |
|
<p class="text-xs text-gray-400">First seen: 2018-11-07</p> |
|
</div> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">94% match</span> |
|
</div> |
|
<div class="flex items-center mb-3"> |
|
<span class="bg-blue-500 text-white text-xs px-2 py-0.5 rounded mr-2">TrickBot</span> |
|
<span class="bg-purple-500 text-white text-xs px-2 py-0.5 rounded mr-2">Operation Cobalt</span> |
|
<span class="bg-yellow-500 text-white text-xs px-2 py-0.5 rounded">Wizard Spider</span> |
|
</div> |
|
<div class="text-sm mb-3"> |
|
<p class="text-gray-400">Shared characteristics:</p> |
|
<ul class="list-disc list-inside text-gray-300 text-xs space-y-1 mt-1"> |
|
<li>Identical C2 communication pattern</li> |
|
<li>Similar persistence mechanism</li> |
|
<li>Shared encryption algorithm</li> |
|
</ul> |
|
</div> |
|
<div class="flex justify-between items-center text-xs"> |
|
<a href="#" class="text-blue-400 hover:underline">View analysis</a> |
|
<button class="bg-gray-700 hover:bg-gray-600 px-2 py-1 rounded">Compare</button> |
|
</div> |
|
</div> |
|
<div class="malware-card bg-gray-900 rounded-lg p-4 border border-gray-700 transition duration-300"> |
|
<div class="flex justify-between items-start mb-2"> |
|
<div> |
|
<h4 class="font-medium">BazarLoader v2</h4> |
|
<p class="text-xs text-gray-400">First seen: 2020-02-14</p> |
|
</div> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">82% match</span> |
|
</div> |
|
<div class="flex items-center mb-3"> |
|
<span class="bg-green-500 text-white text-xs px-2 py-0.5 rounded mr-2">BazarLoader</span> |
|
<span class="bg-purple-500 text-white text-xs px-2 py-0.5 rounded mr-2">Operation Cobalt</span> |
|
<span class="bg-yellow-500 text-white text-xs px-2 py-0.5 rounded">Wizard Spider</span> |
|
</div> |
|
<div class="text-sm mb-3"> |
|
<p class="text-gray-400">Shared characteristics:</p> |
|
<ul class="list-disc list-inside text-gray-300 text-xs space-y-1 mt-1"> |
|
<li>Similar initial loader code</li> |
|
<li>Common C2 infrastructure</li> |
|
<li>Overlapping TTPs</li> |
|
</ul> |
|
</div> |
|
<div class="flex justify-between items-center text-xs"> |
|
<a href="#" class="text-blue-400 hover:underline">View analysis</a> |
|
<button class="bg-gray-700 hover:bg-gray-600 px-2 py-1 rounded">Compare</button> |
|
</div> |
|
</div> |
|
<div class="malware-card bg-gray-900 rounded-lg p-4 border border-gray-700 transition duration-300"> |
|
<div class="flex justify-between items-start mb-2"> |
|
<div> |
|
<h4 class="font-medium">Ryuk v1.3</h4> |
|
<p class="text-xs text-gray-400">First seen: 2019-08-22</p> |
|
</div> |
|
<span class="text-xs bg-blue-900 text-blue-200 px-2 py-0.5 rounded">67% match</span> |
|
</div> |
|
<div class="flex items-center mb-3"> |
|
<span class="bg-red-500 text-white text-xs px-2 py-0.5 rounded mr-2">Ryuk</span> |
|
<span class="bg-purple-500 text-white text-xs px-2 py-0.5 rounded mr-2">Operation Cobalt</span> |
|
<span class="bg-yellow-500 text-white text-xs px-2 py-0.5 rounded">Wizard Spider</span> |
|
</div> |
|
<div class="text-sm mb-3"> |
|
<p class="text-gray-400">Shared characteristics:</p> |
|
<ul class="list-disc list-inside text-gray-300 text-xs space-y-1 mt-1"> |
|
<li>Similar encryption implementation</li> |
|
<li>Common lateral movement techniques</li> |
|
<li>Shared infrastructure components</li> |
|
</ul> |
|
</div> |
|
<div class="flex justify-between items-center text-xs"> |
|
<a href="#" class="text-blue-400 hover:underline">View analysis</a> |
|
<button class="bg-gray-700 hover:bg-gray-600 px-2 py-1 rounded">Compare</button> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 rounded-lg p-4"> |
|
<div class="flex justify-between items-center mb-4"> |
|
<h3 class="font-semibold">Actionable Intelligence</h3> |
|
<button class="bg-blue-600 hover:bg-blue-700 text-white px-3 py-1 rounded text-sm flex items-center"> |
|
<i class="fas fa-file-export mr-1"></i> |
|
<span>Generate Report</span> |
|
</button> |
|
</div> |
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4"> |
|
<div class="bg-gray-900 rounded-lg p-4"> |
|
<div class="flex items-center mb-3"> |
|
<div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center mr-3"> |
|
<i class="fas fa-search text-blue-400"></i> |
|
</div> |
|
<h4 class="font-medium">Threat Hunting</h4> |
|
</div> |
|
<ul class="text-sm space-y-2"> |
|
<li class="flex items-start"> |
|
<i class="fas fa-check-circle text-green-400 mt-1 mr-2"></i> |
|
<span>Search for IOCs in your environment: <span class="font-mono text-blue-300">malware-c2[.]com</span>, <span class="font-mono text-blue-300">185.143.223.47</span></span> |
|
</li> |
|
<li class="flex items-start"> |
|
<i class="fas fa-check-circle text-green-400 mt-1 mr-2"></i> |
|
<span>Look for processes with command-line parameters matching known patterns</span> |
|
</li> |
|
<li class="flex items-start"> |
|
<i class="fas fa-check-circle text-green-400 mt-1 mr-2"></i> |
|
<span>Monitor registry keys for persistence mechanisms</span> |
|
</li> |
|
</ul> |
|
</div> |
|
<div class="bg-gray-900 rounded-lg p-4"> |
|
<div class="flex items-center mb-3"> |
|
<div class="w-10 h-10 rounded-full bg-purple-900 flex items-center justify-center mr-3"> |
|
<i class="fas fa-shield-alt text-purple-400"></i> |
|
</div> |
|
<h4 class="font-medium">Detection Rules</h4> |
|
</div> |
|
<ul class="text-sm space-y-2"> |
|
<li class="flex items-start"> |
|
<i class="fas fa-file-code text-yellow-400 mt-1 mr-2"></i> |
|
<span>YARA rule: <span class="font-mono text-purple-300">TrickBot_Loader_v4</span> (92% match)</span> |
|
</li> |
|
<li class="flex items-start"> |
|
<i class="fas fa-file-code text-yellow-400 mt-1 mr-2"></i> |
|
<span>Sigma rule: <span class="font-mono text-purple-300">Ryuk_Encryption_Process</span></span> |
|
</li> |
|
<li class="flex items-start"> |
|
<i class="fas fa-file-code text-yellow-400 mt-1 mr-2"></i> |
|
<span>Suricata rule: <span class="font-mono text-purple-300">ET MALWARE TrickBot C2 Beacon</span></span> |
|
</li> |
|
</ul> |
|
</div> |
|
<div class="bg-gray-900 rounded-lg p-4"> |
|
<div class="flex items-center mb-3"> |
|
<div class="w-10 h-10 rounded-full bg-red-900 flex items-center justify-center mr-3"> |
|
<i class="fas fa-user-shield text-red-400"></i> |
|
</div> |
|
<h4 class="font-medium">Mitigation</h4> |
|
</div> |
|
<ul class="text-sm space-y-2"> |
|
<li class="flex items-start"> |
|
<i class="fas fa-ban text-red-400 mt-1 mr-2"></i> |
|
<span>Block communication to known C2 domains/IPs</span> |
|
</li> |
|
<li class="flex items-start"> |
|
<i class="fas fa-ban text-red-400 mt-1 mr-2"></i> |
|
<span>Disable SMBv1 and restrict RDP access</span> |
|
</li> |
|
<li class="flex items-start"> |
|
<i class="fas fa-ban text-red-400 mt-1 mr-2"></i> |
|
<span>Implement application whitelisting for critical directories</span> |
|
</li> |
|
</ul> |
|
</div> |
|
</div> |
|
</div> |
|
</main> |
|
</div> |
|
</div> |
|
|
|
<script> |
|
|
|
document.querySelectorAll('.tab-button').forEach(button => { |
|
button.addEventListener('click', () => { |
|
|
|
document.querySelectorAll('.tab-button').forEach(btn => { |
|
btn.classList.remove('border-blue-500', 'text-blue-400'); |
|
btn.classList.add('text-gray-400'); |
|
}); |
|
|
|
document.querySelectorAll('.tab-content').forEach(content => { |
|
content.classList.remove('active'); |
|
}); |
|
|
|
|
|
button.classList.add('border-blue-500', 'text-blue-400'); |
|
button.classList.remove('text-gray-400'); |
|
|
|
const tabId = button.getAttribute('data-tab'); |
|
document.getElementById(tabId).classList.add('active'); |
|
}); |
|
}); |
|
|
|
|
|
setTimeout(() => { |
|
const graphContainer = document.getElementById('relationshipGraph'); |
|
graphContainer.innerHTML = ` |
|
<div class="relative h-full"> |
|
<div class="draggable-node absolute top-1/4 left-1/4 w-24 h-24 rounded-full bg-blue-900 border-2 border-blue-400 flex flex-col items-center justify-center cursor-move" style="transform: translate(-50%, -50%)"> |
|
<i class="fas fa-bug text-xl text-blue-300 mb-1"></i> |
|
<span class="text-xs font-medium">Current Sample</span> |
|
<span class="text-xxs text-gray-300">TrickBot v4.2</span> |
|
</div> |
|
|
|
<div class="draggable-node absolute top-1/3 left-1/2 w-20 h-20 rounded-full bg-blue-800 border-2 border-blue-400 flex flex-col items-center justify-center cursor-move" style="transform: translate(-50%, -50%)"> |
|
<i class="fas fa-bug text-lg text-blue-300 mb-1"></i> |
|
<span class="text-xs">TrickBot v3.1</span> |
|
<span class="text-xxs text-gray-300">94%</span> |
|
</div> |
|
|
|
<div class="draggable-node absolute top-2/3 left-1/3 w-20 h-20 rounded-full bg-green-800 border-2 border-green-400 flex flex-col items-center justify-center cursor-move" style="transform: translate(-50%, -50%)"> |
|
<i class="fas fa-bug text-lg text-green-300 mb-1"></i> |
|
<span class="text-xs">BazarLoader</span> |
|
<span class="text-xxs text-gray-300">82%</span> |
|
</div> |
|
|
|
<div class="draggable-node absolute top-3/4 left-3/4 w-20 h-20 rounded-full bg-red-800 border-2 border-red-400 flex flex-col items-center justify-center cursor-move" style="transform: translate(-50%, -50%)"> |
|
<i class="fas fa-bug text-lg text-red-300 mb-1"></i> |
|
<span class="text-xs">Ryuk v1.3</span> |
|
<span class="text-xxs text-gray-300">67%</span> |
|
</div> |
|
|
|
<svg class="absolute inset-0 w-full h-full" style="z-index: 0;"> |
|
<line x1="25%" y1="25%" x2="50%" y2="33%" stroke="#3B82F6" stroke-width="2" stroke-dasharray="5,5" /> |
|
<line x1="25%" y1="25%" x2="33%" y2="75%" stroke="#10B981" stroke-width="2" stroke-dasharray="5,5" /> |
|
<line x1="25%" y1="25%" x2="75%" y2="75%" stroke="#EF4444" stroke-width="2" stroke-dasharray="5,5" /> |
|
</svg> |
|
</div> |
|
`; |
|
|
|
|
|
document.querySelectorAll('.draggable-node').forEach(node => { |
|
let isDragging = false; |
|
let offsetX, offsetY; |
|
|
|
node.addEventListener('mousedown', (e) => { |
|
isDragging = true; |
|
const rect = node.getBoundingClientRect(); |
|
offsetX = e.clientX - rect.left; |
|
offsetY = e.clientY - rect.top; |
|
node.style.zIndex = '10'; |
|
node.style.cursor = 'grabbing'; |
|
}); |
|
|
|
document.addEventListener('mousemove', (e) => { |
|
if (!isDragging) return; |
|
|
|
const container = graphContainer.getBoundingClientRect(); |
|
let x = e.clientX - container.left - offsetX; |
|
let y = e.clientY - container.top - offsetY; |
|
|
|
|
|
x = Math.max(0, Math.min(x, container.width - node.offsetWidth)); |
|
y = Math.max(0, Math.min(y, container.height - node.offsetHeight)); |
|
|
|
node.style.left = `${x}px`; |
|
node.style.top = `${y}px`; |
|
node.style.transform = 'translate(0, 0)'; |
|
}); |
|
|
|
document.addEventListener('mouseup', () => { |
|
isDragging = false; |
|
node.style.zIndex = '1'; |
|
node.style.cursor = 'move'; |
|
}); |
|
}); |
|
}, 1000); |
|
|
|
|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
|
const ttpCtx = document.getElementById('ttpHeatmap').getContext('2d'); |
|
const ttpHeatmap = new Chart(ttpCtx, { |
|
type: 'bar', |
|
data: { |
|
labels: ['Execution', 'Persistence', 'Defense Evasion', 'Cred Access', 'Discovery', 'Lateral Movement', 'Collection', 'Exfiltration', 'Impact'], |
|
datasets: [ |
|
{ |
|
label: 'Current Sample', |
|
data: [92, 95, 89, 45, 78, 82, 60, 55, 85], |
|
backgroundColor: 'rgba(59, 130, 246, 0.7)', |
|
borderColor: 'rgba(59, 130, 246, 1)', |
|
borderWidth: 1 |
|
}, |
|
{ |
|
label: 'Family Average', |
|
data: [85, 90, 82, 40, 75, 78, 55, 50, 80], |
|
backgroundColor: 'rgba(16, 185, 129, 0.7)', |
|
borderColor: 'rgba(16, 185, 129, 1)', |
|
borderWidth: 1 |
|
} |
|
] |
|
}, |
|
options: { |
|
responsive: true, |
|
maintainAspectRatio: false, |
|
scales: { |
|
y: { |
|
beginAtZero: true, |
|
max: 100, |
|
grid: { |
|
color: 'rgba(255, 255, 255, 0.1)' |
|
}, |
|
ticks: { |
|
color: 'rgba(255, 255, 255, 0.7)' |
|
} |
|
}, |
|
x: { |
|
grid: { |
|
display: false |
|
}, |
|
ticks: { |
|
color: 'rgba(255, 255, 255, 0.7)' |
|
} |
|
} |
|
}, |
|
plugins: { |
|
legend: { |
|
labels: { |
|
color: 'rgba(255, 255, 255, 0.7)' |
|
} |
|
} |
|
} |
|
} |
|
}); |
|
|
|
|
|
const similarityCtx = document.getElementById('similarityChart').getContext('2d'); |
|
const similarityChart = new Chart(similarityCtx, { |
|
type: 'radar', |
|
data: { |
|
labels: ['Code Structure', 'Imports', 'Strings', 'Encryption', 'C2 Comms', 'Persistence', 'Lateral Movement'], |
|
datasets: [ |
|
{ |
|
label: 'Current vs TrickBot v3.1', |
|
data: [94, 89, 92, 91, 95, 87, 82], |
|
backgroundColor: 'rgba(59, 130, 246, 0.2)', |
|
borderColor: 'rgba(59, 130, 246, 1)', |
|
borderWidth: 2, |
|
pointBackgroundColor: 'rgba(59, 130, 246, 1)' |
|
}, |
|
{ |
|
label: 'Current vs BazarLoader', |
|
data: [82, 75, 78, 68, 72, 80, 65], |
|
backgroundColor: 'rgba(16, 185, 129, 0.2)', |
|
borderColor: 'rgba(16, 185, 129, 1)', |
|
borderWidth: 2, |
|
pointBackgroundColor: 'rgba(16, 185, 129, 1)' |
|
} |
|
] |
|
}, |
|
options: { |
|
responsive: true, |
|
maintainAspectRatio: false, |
|
scales: { |
|
r: { |
|
angleLines: { |
|
color: 'rgba(255, 255, 255, 0.1)' |
|
}, |
|
grid: { |
|
color: 'rgba(255, 255, 255, 0.1)' |
|
}, |
|
pointLabels: { |
|
color: 'rgba(255, 255, 255, 0.7)' |
|
}, |
|
ticks: { |
|
backdropColor: 'rgba(0, 0, 0, 0)', |
|
color: 'rgba(255, 255, 255, 0.5)', |
|
stepSize: 20 |
|
} |
|
} |
|
}, |
|
plugins: { |
|
legend: { |
|
labels: { |
|
color: 'rgba(255, 255, 255, 0.7)' |
|
} |
|
} |
|
} |
|
} |
|
}); |
|
|
|
|
|
const iocTimelineOptions = { |
|
series: [{ |
|
name: 'IOC Occurrences', |
|
data: [ |
|
{ x: '2020-01', y: 5 }, |
|
{ x: '2020-04', y: 8 }, |
|
{ x: '2020-07', y: 12 }, |
|
{ x: '2020-10', y: 18 }, |
|
{ x: '2021-01', y: 15 }, |
|
{ x: '2021-04', y: 22 }, |
|
{ x: '2021-07', y: 28 }, |
|
{ x: '2021-10', y: 32 }, |
|
{ x: '2022-01', y: 25 }, |
|
{ x: '2022-04', y: 18 }, |
|
{ x: '2022-07', y: 14 }, |
|
{ x: '2022-10', y: 10 }, |
|
{ x: '2023-01', y: 8 }, |
|
{ x: '2023-04', y: 12 } |
|
] |
|
}], |
|
chart: { |
|
height: '100%', |
|
type: 'area', |
|
foreColor: '#CBD5E0', |
|
toolbar: { |
|
show: true, |
|
tools: { |
|
download: true, |
|
selection: true, |
|
zoom: true, |
|
zoomin: true, |
|
zoomout: true, |
|
pan: true, |
|
reset: true |
|
} |
|
}, |
|
zoom: { |
|
enabled: true |
|
} |
|
}, |
|
dataLabels: { |
|
enabled: false |
|
}, |
|
stroke: { |
|
curve: 'smooth', |
|
width: 2, |
|
colors: ['#3B82F6'] |
|
}, |
|
fill: { |
|
type: 'gradient', |
|
gradient: { |
|
shadeIntensity: 1, |
|
opacityFrom: 0.7, |
|
opacityTo: 0.3, |
|
stops: [0, 90, 100] |
|
}, |
|
colors: ['#3B82F6'] |
|
}, |
|
xaxis: { |
|
type: 'category', |
|
axisBorder: { |
|
show: false |
|
}, |
|
axisTicks: { |
|
show: false |
|
} |
|
}, |
|
yaxis: { |
|
labels: { |
|
formatter: function(val) { |
|
return val.toFixed(0); |
|
} |
|
} |
|
}, |
|
tooltip: { |
|
enabled: true, |
|
theme: 'dark', |
|
x: { |
|
format: 'MMM yyyy' |
|
} |
|
}, |
|
grid: { |
|
borderColor: 'rgba(255, 255, 255, 0.1)' |
|
} |
|
}; |
|
|
|
const iocTimelineChart = new ApexCharts(document.querySelector("#iocTimelineChart"), iocTimelineOptions); |
|
iocTimelineChart.render(); |
|
}); |
|
</script> |
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=CrypticallyRequie/malwarecorrelator" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
</html> |