haritsahm
Fix display info with html
9db4a7b
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
* {
box-sizing: border-box;
}
.body {
font-family: 'Source Sans Pro', sans-serif;
font-size: 16px;
}
.container {
width: 100%;
margin: 0 auto;
}
.title {
font-size: 24px !important;
font-weight: 600 !important;
font-family: 'Source Sans Pro', sans-serif;
letter-spacing: 0em;
text-align: center;
color: #374159 !important;
}
.subtitle {
font-size: 24px !important;
font-style: italic;
font-weight: 400 !important;
font-family: 'Source Sans Pro', sans-serif;
letter-spacing: 0em;
text-align: center;
color: #1d652a !important;
padding-bottom: 0.5em;
}
.overview-heading {
font-size: 24px !important;
font-weight: 600 !important;
font-family: 'Source Sans Pro', sans-serif;
letter-spacing: 0em;
text-align: left;
}
.overview-content {
font-size: 14px !important;
font-weight: 400 !important;
font-family: 'Source Sans Pro', sans-serif;
line-height: 30px !important;
letter-spacing: 0em;
text-align: left;
}
.content-image {
width: 100% !important;
height: auto !important;
}
.vl {
border-left: 5px solid #1d652a;
padding-left: 20px;
color: #1d652a !important;
}
.grid-container {
display: grid;
grid-template-columns: 1fr 2fr;
gap: 20px;
align-items: flex-start;
margin-bottom: 0.7em;
}
@media screen and (max-width: 768px) {
.container {
width: 90%;
}
.grid-container {
display: block;
}
.overview-heading {
font-size: 18px !important;
}
}
</style>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600;700&display=swap" rel="stylesheet" />
</head>
<body>
<div class="container">
<h1 class="title">MedSAM: Segment Anything in Medical Images</h1>
<h2 class="subtitle">Kalbe Digital Lab</h2>
<section class="overview">
<div class="grid-container">
<h3 class="overview-heading"><span class="vl">Overview</span></h3>
<p class="overview-content">
MedSAM, a foundation model for universal medical image segmentation. MedSAM is adapted from the SAM model on an unprecedented scale, with more than one million medical image-mask pairs.
<br />
Reference: <a href="https://arxiv.org/abs/2304.12306" target="_blank">https://arxiv.org/abs/2204.05798</a>
</p>
</div>
<div class="grid-container">
<h3 class="overview-heading"><span class="vl">Dataset</span></h3>
<div>
<p class="overview-content">The model is trained using a diverse and large-scale medical image segmentation dataset with 1,090,486 medical image-mask pairs, covering 15 imaging modalities, over 30 cancer types, and a multitude of imaging protocols.</p>
<ul class="overview-content">
<li>Target: Capturing a broad spectrum of anatomies and lesions across different modalities.</li>
<li>Task: Segmentation</li>
<li>Modality: Computed Tomography (CT), Magnetic Resonance Imaging (MRI), Endoscopy, Ultrasound, Pathology, Fundus, Dermoscopy, Mammography, and Optical Coherence Tomography (OCT).</li>
</ul>
</div>
</div>
<div class="grid-container">
<h3 class="overview-heading"><span class="vl">Model Architecture</span></h3>
<div>
<p class="overview-content">Segment Anything - MedSAM</p>
<img class="content-image" src="" alt="model-architecture">
</div>
</div>
</section>
<h3 class="overview-heading"><span class="vl">Demo</span></h3>
</div>
</body>
</html>