diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..7f00dcb208f73466ba554ecaed2fd53b0f61f391 Binary files /dev/null and b/.DS_Store differ diff --git a/images/.DS_Store b/images/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..54826e2fd7eea798b410f1bfedea5b104fd879dd Binary files /dev/null and b/images/.DS_Store differ diff --git a/images/man-Dall_E2.png b/images/man-Dall_E2.png new file mode 100644 index 0000000000000000000000000000000000000000..104cd55aeb2397ac8e06ac3f3ee3d127c2e6b5ca Binary files /dev/null and b/images/man-Dall_E2.png differ diff --git a/images/man-top.jpg b/images/man-top.jpg new file mode 100644 index 0000000000000000000000000000000000000000..0df9c37b623e6fd01f4d9841e50533a57b39a0c0 Binary files /dev/null and b/images/man-top.jpg differ diff --git a/images/man.jpg b/images/man.jpg new file mode 100644 index 0000000000000000000000000000000000000000..8e44320d8e03ef2997701823adad2f5e7cbe083e Binary files /dev/null and b/images/man.jpg differ diff --git a/images/man_panorama_withFace.png b/images/man_panorama_withFace.png new file mode 100644 index 0000000000000000000000000000000000000000..98e2f6e51885b83f7f40b71fcfeb00158953264a Binary files /dev/null and b/images/man_panorama_withFace.png differ diff --git a/images/removeBgImage.png b/images/removeBgImage.png new file mode 100644 index 0000000000000000000000000000000000000000..edba168fce1cc08fceb8b3167ec25d9f9d8a51ab Binary files /dev/null and b/images/removeBgImage.png differ diff --git a/images/removeBgImage_black.png b/images/removeBgImage_black.png new file mode 100644 index 0000000000000000000000000000000000000000..cc1fe3252c668f3f509f304792415e696caf5f12 Binary files /dev/null and b/images/removeBgImage_black.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000000000000000000000000000000000000..93f17355ff546dee271569334aab7d09a55f4dff --- /dev/null +++ b/index.html @@ -0,0 +1,91 @@ +<!DOCTYPE html> +<html lang="en"> + <head> + <meta charset="UTF-8" /> + <meta http-equiv="X-UA-Compatible" content="IE=edge" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0" /> + <title>Document</title> + <link + href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" + rel="stylesheet" + integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" + crossorigin="anonymous" + /> + + <link rel="stylesheet" href="app.css" /> + </head> + <body> + <div class="navbar navbar-dark bg-dark shadow-sm"> + <div class="container"> + <a href="#" class="navbar-brand d-flex align-items-center"> + <svg + xmlns="http://www.w3.org/2000/svg" + width="20" + height="20" + fill="none" + stroke="currentColor" + stroke-linecap="round" + stroke-linejoin="round" + stroke-width="2" + aria-hidden="true" + class="me-2" + viewBox="0 0 24 24" + > + <path + d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z" + /> + <circle cx="12" cy="13" r="4" /> + </svg> + <strong>Image processing </strong> + </a> + </div> + </div> + <div class="container text-center"> + <div class="row"> + <div class="col-lg-6"> + <img class="img-size" src="./images/man.jpg" alt="" /> + <p>원본 이미지 525 x 700 px</p> + </div> + <div class="col-lg-6"> + <img class="img-size" src="./images/man-Dall_E2.png" alt="" /> + <p>배경 확장된 이미지 1024 x 1024 px</p> + </div> + </div> + <div class="row"> + <div class="col"> + <img class="img-size" src="./images/man.jpg" alt="" /> + <p>Person</p> + </div> + <div class="col"> + <img class="img-size" src="./images/man-top.jpg" alt="" /> + <p>Top</p> + </div> + <div class="col"> + <img src="./images/man_panorama_withFace.png" alt="" /> + <p>panorama_withFace</p> + </div> + </div> + <div class="row"> + <div class="col"> + <img src="./images/OutputImage2.png" alt="" /> + <p>배경 삭제된 이미지</p> + </div> + <div class="col"> + <img src="./images/OutputImage_black.png" alt="" /> + <p>배경 검은색</p> + </div> + </div> + + <button type="button" class="btn btn-primary btn-lg">배경 흰색</button> + <button type="button" class="btn btn-secondary btn-lg"> + 배경 검정색 + </button> + </div> + <script + src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" + integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" + crossorigin="anonymous" + ></script> + <script src="app.js"></script> + </body> +</html> diff --git a/main.js b/main.js new file mode 100644 index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391 diff --git a/style.css b/style.css new file mode 100644 index 0000000000000000000000000000000000000000..ae58148f5d40e4e83d337d4a8d786d9e367caad5 --- /dev/null +++ b/style.css @@ -0,0 +1,4 @@ +.img-size { + max-width: 100%; + margin-top: 20px; +}