디시인사이드 갤러리

마이너 갤러리 이슈박스, 최근방문 갤러리

갤러리 본문 영역

[일반] also gpt 가 20초만에 만든 디자인 수준 봐라 ㅋㅋㅋ

ㅇㅇ(125.137) 2024.05.07 21:14:23
조회 332 추천 1 댓글 5
														


a16711aa372a76b660b8f68b12d21a1dd081dd30c186


순수 html 으로 시발 ㅋㅋㅋㅋ 영상이 안 올라가져서 사진으로 올렸는데, 저거 원들 둥둥 떠다니는 애니메이션 들어가있고, 버튼 후버 효과도 다 들어가있음. 프롬프트 걍 

"이젠 아예 인간 규격을 벗어난 아주 희한한 웹사이트 만들어봐"

이거 하나 입력함 ㅋㅋㅋㅋㅋㅋㅋㅋㅋ 


아래 소스 코드 돌려봐라 .

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>The Bizarre Universe</title>

    <style>

        /* Reset and Global Styles */

        * {

            margin: 0;

            padding: 0;

            box-sizing: border-box;

        }


        html, body {

            height: 100%;

            font-family: 'Comic Sans MS', sans-serif;

            overflow: hidden;

        }


        /* Background Gradient */

        body {

            background: radial-gradient(circle, #2b2d42, #000000);

            display: flex;

            justify-content: center;

            align-items: center;

            flex-direction: column;

            text-align: center;

            color: #ffffff;

        }


        /* Heading */

        h1 {

            font-size: 4em;

            margin-bottom: 20px;

            color: #ff6b6b;

            text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);

            transform: rotate(-15deg);

        }


        /* Paragraph */

        p {

            font-size: 1.5em;

            margin-bottom: 30px;

            color: #f8f3d4;

            text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);

            transform: rotate(10deg);

        }


        /* Button Styles */

        .btn {

            display: inline-block;

            padding: 15px 40px;

            margin: 10px;

            background: rgba(0, 0, 0, 0.2);

            border: 3px dashed rgba(255, 255, 255, 0.6);

            color: #ffffff;

            text-transform: uppercase;

            letter-spacing: 2px;

            text-decoration: none;

            border-radius: 50%;

            transition: all 0.3s ease;

            transform: rotate(-5deg);

            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.6);

        }


        .btn:hover {

            background: rgba(0, 0, 0, 0.5);

            border-color: rgba(255, 255, 255, 1);

            box-shadow: 0 20px 30px rgba(0, 0, 0, 0.8);

            transform: scale(1.1) rotate(10deg);

        }


        /* Floating Elements */

        .floating-blob {

            position: absolute;

            width: 200px;

            height: 200px;

            background: linear-gradient(135deg, #ff6b6b, #f8f3d4);

            border-radius: 50%;

            box-shadow: 0 15px 25px rgba(0, 0, 0, 0.5);

            animation: blob-float 6s ease-in-out infinite;

        }


        .small-blob {

            width: 100px;

            height: 100px;

            animation-duration: 4s;

        }


        .big-blob {

            width: 300px;

            height: 300px;

            animation-duration: 8s;

        }


        @keyframes blob-float {

            0%, 100% {

                transform: translateY(-10px) rotate(0deg);

            }

            50% {

                transform: translateY(10px) rotate(360deg);

            }

        }


        /* Random Positions */

        .blob1 {

            top: 10%;

            left: 5%;

        }


        .blob2 {

            bottom: 20%;

            right: 10%;

        }


        .blob3 {

            top: 30%;

            right: 20%;

        }


        .blob4 {

            bottom: 30%;

            left: 25%;

        }


        /* Footer */

        footer {

            position: absolute;

            bottom: 10px;

            width: 100%;

            text-align: center;

            font-size: 0.9em;

            color: rgba(255, 255, 255, 0.7);

        }


        footer a {

            color: rgba(255, 255, 255, 0.9);

            text-decoration: none;

        }


        footer a:hover {

            text-decoration: underline;

        }

    </style>

</head>

<body>

    <h1>Welcome to the Bizarre Universe</h1>

    <p>Explore the realms beyond imagination</p>

    <a href="#" class="btn">Embark Journey</a>

    <a href="#" class="btn">Meet the Unknown</a>

    <div class="floating-blob blob1"></div>

    <div class="floating-blob blob2 small-blob"></div>

    <div class="floating-blob blob3 big-blob"></div>

    <div class="floating-blob blob4"></div>

    <footer>

        © 2024 by <a href="https://example.com" target="_blank">Your Name</a>. Crafted with weirdness.

    </footer>

</body>

</html>

자동등록방지

추천 비추천

1

고정닉 0

원본 첨부파일 1

댓글 영역

전체 댓글 0
등록순정렬 기준선택
본문 보기

하단 갤러리 리스트 영역

왼쪽 컨텐츠 영역

갤러리 리스트 영역

갤러리 리스트
번호 말머리 제목 글쓴이 작성일 조회 추천
2863 설문 시세차익 부러워 부동산 보는 눈 배우고 싶은 스타는? 운영자 24/05/27 - -
476014 일반 노화는 순리이자 불변 맞지? [6] ㅇㅇ(218.50) 05.16 255 0
476013 일반 근데 사람만 역노화 안된다는거면... [7] ㅇㅇ갤로그로 이동합니다. 05.16 271 3
476012 일반 GPT-4o 이미지 샘플 ㄷㄷㄷ [5] 디붕이(121.190) 05.16 552 0
476011 일반 프로그램 대 버그 현상에 대한 걱정 [5] xdxd333갤로그로 이동합니다. 05.16 172 0
476010 일반 ㄱㅂㅅㄷ 언제하나여 [46] Moriae갤로그로 이동합니다. 05.16 378 1
476009 일반 gpt3.5가 예측이 200b정도였나 처음에 [8] ㅇㅇ(211.46) 05.16 218 0
476008 일반 규제같은건 중국이 좀 밀어버려야함 [3] ㅇㅇ(58.29) 05.16 142 0
476007 일반 공x원 면직했다 [7] ㅇㅇ(211.197) 05.16 324 0
476006 정보/ 삼성 갤럭시와 XR기기에 구글 제미나이와 보고듣고말하는 AI 탑제 [2] ㅇㅇ(222.234) 05.16 459 5
476005 일반 예전에는 대답이 그렇게 길지 않았었는데 4o는 [2] ㅇㅇ(221.148) 05.16 163 0
476004 일반 한국에 ai스타트업 2000개나 있네 [3] ㅇㅇ(58.29) 05.16 335 0
476003 일반 룬붕이가 누군지 모르겠다 싶은 선형들은 [5] 특술람갤로그로 이동합니다. 05.16 175 0
476002 일반 $7999 [5] ㅇㅇ갤로그로 이동합니다. 05.16 217 1
476001 일반 근데 결국 사칙연산 문제는 해결해야 한다고 봄 [21] ㅇㅇ(115.139) 05.16 235 0
476000 일반 프로그래밍 = 코드 + 생각임 ㅇㅇ갤로그로 이동합니다. 05.16 96 1
475999 일반 AGI가 개발돼서 현재의 터빈발전기를 보면 ㅇㅇ(211.184) 05.16 69 0
475998 일반 일리야가 오픈소스 회사 차린다고 하면 호재임?? [6] ㅇㅇ갤로그로 이동합니다. 05.16 202 2
475997 일반 사람도 분명 환각이 잇긴한데 다른점이 [2] ㅇㅇ(117.20) 05.16 133 1
475996 일반 뉴욕타임즈 1903년 기사 [5] ㅇㅇ갤로그로 이동합니다. 05.16 257 3
475995 일반 gpt 4o 코딩능력도 사기급임? [4] ㅇㅇ(211.105) 05.16 270 0
475994 일반 [소신발언] 클로드가 GPT-4o보다 살짝 더 똑똑하다. [17] 선갤러(61.73) 05.16 745 6
475993 일반 제일 듣기 싫은 소리 >>>> 사람도 환각있는데? [12] ㅇㅇ(221.155) 05.16 290 0
475992 일반 Gpt 쓰면서 항상 아쉬운점 [1] ㅇㅇ갤로그로 이동합니다. 05.16 93 0
475991 일반 비정상회담 닉도 특슬람인듯 [4] ㅇㅇ(182.230) 05.16 153 1
475990 일반 4o가 오히려 저능아같이 말해도 알아듣는 능력이 확 올라갔던데 ㅇㅇ(115.139) 05.16 65 0
475989 일반 이 누나도 요즘 4O 성능에 푹빠짐 [15] ㅇㅇ갤로그로 이동합니다. 05.16 668 1
475988 일반 뭐에 베팅하는게 더옳은건지는 자기판단인듯 ㅇㅇ(125.141) 05.16 62 0
475987 일반 이상하게 개발자애들이 발작하네 [10] ㅇㅇ(59.22) 05.16 355 3
475986 일반 Gpt5 출시해도 여전히 이런글 올라올거다 [6] ㅇㅇ(117.20) 05.16 260 0
475985 일반 gpt-4o 다른 건 다 좋은데 네이밍 센스가 [2] ㅇㅇ(116.123) 05.16 136 0
475984 일반 아무리 생각해도 오랜만에 봄이다 ㅇㅇ(121.128) 05.16 46 0
475983 일반 게이만이 gpt5가 gpt5로 안 나올수도 있다고 했잖아 [4] ㅇㅇ갤로그로 이동합니다. 05.16 149 0
475982 일반 gpt5 여름에 나온다고했음 [1] 연맛갤로그로 이동합니다. 05.16 110 0
475981 일반 알파고랑 겹쳐보이는 프로그래밍 [12] ㅇㅇ갤로그로 이동합니다. 05.16 259 2
475980 일반 2025 her 현실화... 그리고 2038 [1] ㅇㅇ(116.123) 05.16 118 0
475979 일반 4O만해도 4터보,오푸스 쳐바르는데 ㅇㅇ(121.134) 05.16 178 0
475977 일반 모두의 기대와 달리 공개된 것은 gpt-4p 였다. [1] ㅇㅇ(211.184) 05.16 175 0
475976 일반 3.5 아예 폐기하고 그냥 gpt4o 횟수 3회씩 추가로 줘라 ㅇㅇ(59.17) 05.16 66 0
475975 AI창 음악: 엄니 사랑해요 ㅇㅇ(61.101) 05.16 43 0
475974 일반 프론티어 모델 제발 [2] ㅇㅇ(211.46) 05.16 116 0
475973 일반 GPT-5 <- 이새끼 도대체 언제 공개함? [2] ㅇㅇ(115.20) 05.16 178 0
475972 일반 내가 볼 땐 오만한 애들이 많음 [6] ㅇㅇ(1.241) 05.16 164 0
475971 일반 지금도 로우레벨 개발자는 허들 낮잖음 ㅇㅇ갤로그로 이동합니다. 05.16 84 0
475970 일반 여름에 gpt5온다는게 맞나보네 저거보니까 [4] ㅇㅇ(121.131) 05.16 306 0
475969 일반 CS지식(프로그래밍) 논쟁 보고있으면 마치 알파고 보는 기분임 ㅋㅋㅋ [5] ㅇㅇ갤로그로 이동합니다. 05.16 146 1
475968 일반 애플 뭐 발표같은 건 언제쯤임?? [2] ㅇㅇ갤로그로 이동합니다. 05.16 73 0
475967 일반 결국 기승전 환각이구만 [2] ㅇㅇ(117.20) 05.16 159 0
475966 일반 가장 대체 안될 것 같은 개발 분야 ㅇㅇ(1.241) 05.16 81 0
475965 일반 프로그래밍의 대체 [5] ㅇㅇ(222.234) 05.16 154 0
475964 일반 이번에 존나 감동한 게 발표 직후에 4o 풀어준거 [7] ㅇㅇ(116.123) 05.16 187 0
갤러리 내부 검색
제목+내용게시물 정렬 옵션

오른쪽 컨텐츠 영역

실시간 베스트

1/8

뉴스

디시미디어

디시이슈

1/2