분류 전체보기355 류예 https://midlibrary.io/focus/liu-ye Liu Ye's style in Midjourney | In Focus series | Andrei Kovalev's MidlibraryDiscover the amazing world of Liu Ye, a Chinese artist who in his paintings masterfully blends Eastern and Western influences, childhood memories with sexual motives, and cute characters with serious contemporary themes. Explore how Midjourney captures themidlibrary.io 2025. 7. 28. Minimalist https://midlibrary.io/tops/21-minimalist-sref-codes 21 Ultra-Minimalist SREF codes | Midjourney Style Compilation #40 | MidlibraryThis week, we’re diving into the essence of simplicity of minimalist SREF codes. Stripping any visuals down to their purest forms—these codes will help you achieve a beautifully minimal aesthetic. Let's explore the power of less!midlibrary.io 2025. 7. 28. IcoMoon으로 부트스트랩 아이콘 몇개만 추려서 커스텀 웹폰트 만들기 📌 사용 방법https://icomoon.io/app 접속"Import Icons" 클릭 → Bootstrap Icons GitHub에서 필요한 SVG 10개만 다운로드 후 업로드필요한 아이콘 선택 후 → 하단의 "Generate Font" 클릭style.css, fonts/ 폴더 등 포함된 폰트 키트 다운로드✅ 장점내가 선택한 아이콘만 포함되어 매우 가볍다폰트라서 CSS 색상 변경도 자유로움용량 걱정 없이 커스터마이징 가능나의 경우 부트스트랩 아이콘 대체라서 이렇게 했다. 2025. 6. 27. 워드프레스 더미 테스트용 글 더미 테스트용 글 가져오기 링크 https://themetest.wordpress.com/ Theme Test DataMy theme is nicer than yoursthemetest.wordpress.com 2025. 6. 23. 42dot Sans 한글 폰트 웹에서 적용하기 https://fonts.google.com/specimen/42dot+Sans 42dot Sans - Google Fonts fonts.google.com이렇게 한글폰트 만들어 무료로 배포하는 개인과 기업들 대단함.. 웹에서 사용하기head 안에 복붙 css 에 복붙 * { font-family: "42dot Sans", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal;} 2025. 4. 15. :is(), :where() 아래 세줄은 같은 내용임 :where() -> 우선순위 낮음 (초기 세팅때 사용하기 좋음).main h1, .article h1, .product h1 {font-size:32px}:where(.main, .article, .product) h1 {font-size:32px} :is(.main, .article, .product) h1 {font-size:32px} 2025. 4. 15. onesharedhouse.com https://onesharedhouse.com/ ONE SHARED HOUSE – an interactive documentaryThirty years ago, eight women embarked on a radical experiment in urban living: they built a communal house in central Amsterdam in which practically everything — from kitchen utensils to childcare — was shared. With co-living making a comeback, New Yoonesharedhouse.com 2025. 4. 14. zumtobel https://z.lighting/en/group/company 2025. 4. 14. shantellmartin.art https://shantellmartin.art/ Shantell MartinAutobiographical and dreamlike, Shantell Martin bridges the fine art and commercial world, as well as the objects, places and conversations of the everyday experience.shantellmartin.art 2025. 4. 14. antonandirene.com https://antonandirene.com/ Anton & Irene antonandirene.com 2025. 4. 14. gsap, hue-rotate, mousemove .cursor{position: relative; pointer-events: none;}.cursor .box { position: absolute; width: 10px; height: 5px; top:-50px; background-color: aqua;box-shadow: 0 0 15px aqua, 0 0 50px aqua ;transform-origin: center 50px;} 2025. 3. 15. 마우스 충돌 1 2025. 3. 12. smoothwheel, 부드러운 마우스 스크롤 https://github.com/fatlinesofcode/jquery.smoothwheel GitHub - fatlinesofcode/jquery.smoothwheel: Cross browser smooth mouse wheel and trackpad scrollingCross browser smooth mouse wheel and trackpad scrolling - fatlinesofcode/jquery.smoothwheelgithub.com 2025. 3. 11. wow.js animate ... 2025. 3. 9. css 3d, transform-style: preserve-3d .box{position: absolute; width: 200px; height: 200px; left: 50%; top: 20%; transform-style: preserve-3d; transform: perspective(1200px) rotateY(-50deg); }.box::before{content: ''; position: absolute; left: 0; bottom: -120px; width: 100%; height: 150px; background: #000; transform: rotateX(90deg);filter: blur(40px);opacity: 0.5;}.box div{position: absolute; inset: 0; transform-style:.. 2025. 3. 7. rotate, mouse move, delay span{position: absolute; width: 40px; height: 5px; border-radius: 3px; background: #0ff; pointer-events: none; transform-origin: 50px; box-shadow: 0 0 10px #0ff, 0 0 20px #0ff; transition: 0.1s;animation: animate 10s linear infinite;}@keyframes animate { 0%{transform: rotate(0deg);} 100%{transform: rotate(360deg);}}const spans = [];const numSpans = 30;for(let i = 0; i { const mouseX = e.. 2025. 3. 7. circle, strokeDashoffset, scrollTop, 그래프 0%let circleIndicator= document.getElementById('circleIndicator');let circle = circleIndicator.querySelector('circle');let textElement = document.getElementById('scrollPercentText');let darrayElement = document.querySelector('.darray');let radius = circle.getAttribute('r');let circum = 2 * Math.PI * radius;circle.style.strokeDasharray = circum;function setProgress(percent){ let offset = circu.. 2025. 3. 6. gsap, mouse move *{margin: 0;padding: 0; box-sizing: border-box;}body{background-color: #000; background-image: linear-gradient(to right, #333 1px , transparent 1px),linear-gradient(to bottom, #333 1px , transparent 1px);background-size: 20px 20px;}.cursor{position: absolute; pointer-events: none; top: 30px; left: 30px;}.box{position: absolute; width: 20px; height: 10px; background: #00ff9a;} 2025. 3. 5. 백남준의 비디오아트말고 그의 그래픽 작품이 더 끌림 평일 아침. 사무실로 출근하다가 그냥 귀찮아져서 미술관으로 발길을 돌렸다. 사실 평일에 미술관은 적막하고 고요한 맛에 가는건데 왠걸. 사람들이 좀 있었다. 알고보니 백남준 전시 중이었던 거다. 1. 그런데 나는 에피타이저로 먼저 들렀던 "미안해요 데이브" 전에서 유니버셜 에브리띵과 이승현 작가의 "디지털생명체연구.." ? 의 작품을 보고 너무 마음에 들어서 주연이라 할 수 있는 "백남준" 전시가 그렇게 눈에 들어오지 않았다. 2. 잘 알려진 비디오아트 말고 그래픽 작업물이 오히려 더 맘에 들었다. 3. 영상 작품의 껍데기가 생각했던 것보다 만듦새가 아주 좋았다. 사진에는 뭔가 고철덩어리나 폐기물처럼 보였었는데, 실물은 클래식하고 단단한 원목 재질로 상태가 좋았다. 2025. 3. 4. 워드프레스 사용자정의 쉬운 편집 버튼 적용하기 function $wp_customize->add_setting( 'main_tel', array( 'default' => '02-1004-1004', 'sanitize_callback' => 'wp_kses_post', 'transport' => 'refresh', ) ); $wp_customize->add_control( 'main_tel', array( 'label' => __( '메인 전화번호', 'your-textdomain' ), 'section' => 'custom_colors2', 'settings' => 'main_tel', 'type' => 'text'.. 2025. 3. 4. 미안해요 데이브 1968년 스텐리 큐브릭(1928~1999)이 감독한 SF 영화 《2001: 스페이스 오디세이》(2001: A Space Odyssey)에서 주인공 데이비드와 우주선의 인공지능 HAL 간의 극단적 대립의 순간, 마치 아득하고 고요한 암흑의 우주 공간과 같은 섬뜩하고 서늘한 HAL의 대답은 진화하는 인류 과학 문명과 환경의 어두운 이면을 매우 적나라하고 간단명료하게 보여준다. “미안해요, 데이브. 유감이지만 난 그럴 수 없어요.” 전시 주제는 이 한 줄로 상징된다. 전시 제목에서도 볼 수 있듯이, ‘데이브(Dave)’라는 단어의 ‘취소선’ 표식은 ‘데이브’와 같이 특정될 수 있는 어느 한 개인이 아닌, 누구라도 ‘데이브’가 될 수 있음을 의미하는 ‘개념 중심 크리에이티브(Conceptualdriven cr.. 2025. 3. 3. round tab, css Home About Services Portfolio Contactheader nav a.active { background: var(--clr);}header nav a.active::before { content: ''; position: absolute; left: -20px; bottom: 0; width: 20px; height: 20px; background: transparent; border-bottom-right-radius: 10px; box-shadow: 5px 5px 0 5px var(--clr); z-index: 2;}header nav a.active::after { content: ''; .. 2025. 3. 3. 원페이지 스크롤 섹션 1섹션 2섹션 3섹션 4섹션 5섹션 1섹션 2섹션 3섹션 4섹션 5const navLinks = document.querySelectorAll("nav a");const sections = document.querySelectorAll("section");// 네비게이션 클릭 시 부드러운 스크롤navLinks.forEach(link => {link.addEventListener("click", function(event) { event.preventDefault(); // 스크롤 애니메이션 중 active 업데이트 방지 isScrolling = true; // 모든 네비게이션에서 active 제거 후 클릭된 요소에 active 추가 navLinks.forEach(a => .. 2025. 3. 3. 카테고리 최근글 쿼리, 갯수는 사용자정의에서 'recom', 'posts_per_page' => get_theme_mod( 'mainslidimg_num', 8 ), // 갯수는 사용자정의 'orderby' => 'date', 'order' => 'DESC' ); $query = new WP_Query($args); if ($query->have_posts()) { echo ''; while ($query->have_posts()) { $query->the_post(); ?> .. 2025. 2. 27. menu bar mouse move // 메뉴 색상바var $marker = $('').appendTo('.menu'); var $navitem = $('.menu > .menu-item'); var $current = $('.menu-item.current-menu-item');if ($current.parents('.sub-menu').length) { // 2차 메뉴 $current = $current.closest('.menu-item-has-children');}function indicator($el) { $marker.css({ left: $el.position().left + 20 + "px", width: $el.outerWidth() - 40 + "px", opacity.. 2025. 2. 25. 폴리곤. 컬러 로테이션 hue-rotate let container = document.querySelector('.container');for (let i = 0; i .row { display: inline-flex; margin-top: -32px; margin-left: -50px;}.row:nth-child(even) { margin-left: 1px;}.row .box { position: relative; width: 100px; height: 110px; background: #0c0c0c; margin: 2px; transition: 2s; clip-path: polygon (50% 0%, 100% 25%, 100% 75%, 50% 100%,0% 75%,0% 25%);}.row .box:hov.. 2025. 2. 24. 블렌더 단축키 S + sh + Z스케일 z는 제외 E돌출 tabedit 전환 토글r + xx축 로테이트sh + A추가 alt + G위치 리셋 sh + C커서 리셋 num . 화면 리셋 sh + D 복제 G + ctl이동중 스냅 ctl + A어플라이 리셋 f9팝업창F채우기 fill face edge split선기순으로 떼어내기 IInset Faces 면 삽입X선택 삭제sh + A엣지 선택 bridge edge loops루프 채우기 sh + 우클릭 커서 배치 + sh미세움직임한글쓰려면메모장에 쓰고 복붙/로컬뷰ctl + R루프컷 sh + alt + 클릭 루프선택ctl + I선택 반전J, ctl + Jjoinalt + Z엑스레이뷰alt + N플립 노말 L링크된 선택 ctl + B베벨P > seperr > select선택 분.. 2025. 2. 24. createElement, mouse move const rounds = [];const numrd = 20;for(let i= 0; i { const mouseX = event.clientX; const mouseY = event.clientY; rounds.forEach((span, index) => { const delay = Math.random() * 200; setTimeout(() => { span.style.left = `${mouseX + 20 + index}px`; span.style.top = `${mouseY + index }px`; }, delay) })})span.round{position: absolute; width: 20p.. 2025. 2. 23. 이전 1 2 3 4 ··· 13 다음
