웹솔루션개발 25년 노하우! 해피CGI의 모든것

테두리를 맞춤으로 설정할 수 있는 사이트입니다.기존 'border:1px dashed #000000' 코드를 사용하면 점 사이의 공간을 조절할 수 없습니다.하지만 해당 사이트에서는 background-image 코드를 사용하여 점 사이의 공간을 줄이거나 늘릴 수 있습니다.1. 사용하고 싶은 테두리를 선택2. 가로, 세로, 획, 점 사이의 공간 등 설정 3. 테두리 색상, 배경색상 설정 4. 만들어진 background-image 코드를 복사하여 붙여넣기 CSS 테두리를 맞춤으로 설정할 수 있는 사이트입니다.

버튼 웨이브 효과가 있으며 반응형 슬라이드 입니다.자세한 내용은 데모사이트 주소에서 확인이 가능합니다.HTML               Fruity                                                Pear              https://www.yudiz.com/codepen/fruity/cane.svg" alt="" />        https://www.yudiz.com/codepen/fruity/Labels.jpg" alt="" />                                                         https://www.yudiz.com/codepen/fruity/pear-one.png" alt="pear-image" /> ..

로그인 박스에 마우스를 올리게 되면 주면 애니메이션 디자인이 바뀌게 됩니다.자세한 내용은 데모사이트 주소에서 확인이 가능합니다.HTML            Login                                                    Forget Password      Signup       CSS @import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@300&display=swap");* {  margin: 0;  padding: 0;  box-sizing: border-box;  font-family: "Quicksand", sans-serif;}body {  display: flex;  justify-con..

기상청에서 제공하는 다양한 날씨정보를 API로 받아 갈 수 있습니다.https://apihub.kma.go.kr/ 웹페이지에서 회원가입이후 이용을 할 수 있습니다.일반회원은 일일 최대 20,000건의 API호출이 가능 합니다.API로 제공되는 정보는 아래와 같습니다.각각의 API별로 샘플코드도 제공이 되므로 참고해서 작업을 하면 편하게 작업이 가능 합니다.

쉽고 가볍게 사용이 가능한 TOAST UI - Rolling 입니다.https://ui.toast.com/tui-rolling https://github.com/nhn/tui.rolling 페이지에서 최신 소스를 다운로드 할 수 있습니다.API 사용법은 https://nhn.github.io/tui.rolling/latest/ 페이지에서 확인 해주시면 됩니다.

손으로 그린 그림, 스크린샷 등을 이용하여 웹사이트 프레임 또는 프로토 타입을 제작해주는디자인 툴 Visily입니다.다양한 카테고리별 다양한 템플릿을 기본 제공하고 있어서 곧바로 웹을 통해 편집도 가능합니다.그외 AI 기능도 탑재되어, 텍스트로 다이어그램, 일부 디자인도 생성, 추천해주네요.시작부터 하는 디자인툴이 아닌 다양한 템플릿, 환경 등을 제공하여 보다 빠른 디자인작업이 가능하도록구성된 기능이네요.현재 무료로 사용 가능하며, 추후 AI 활용 기능이 많아지면 유료로 서비스 할 듯하네요.텍스트를 통해 AI가 더욱 다양한 디자인을 만들어주면 훨씬 활용도나 속도가 빨라지겠네요.

UI  디자인을 간편하게 도와주는 AI 도구 'Creatie'입니다.요즘 가장 큰 관심사 와 AI를 디자인툴에 접목한 따끈따근한 디자인 툴 Creatie 입니다.기본 UI는 피그마와 유사하며, 피그마, 스케치, XD 등 다양한 파일을 지원합니다.AI를 활용하여 컴포넌트를 생성해주고 조건 설정에 따라 아이콘을 생성하며, 다양한 디자인 스타일 도와주는 등 활용도나 완성도가 높은 디자인을 하기 위해 지원합니다.

로드맵 은 미묘한 fadeIn 애니메이션을 사용하여 반응형, 스크롤 가능, 수평/수직 슬라이더로 이벤트를 동적으로 표시하는 jQuery가 포함된 타임라인 슬라이더 플러그인입니다. 타임라인 슬라이더는 현재 화면 크기 에 따라 방향을 자동으로 변경합니다 .데스크톱 및 모바일과 호환됩니다.다운로드 받은 파일의 압축을 해제한 뒤examples/index.html 파일을 웹브라우저로 열어보면 데모를 확인해볼 수 있습니다.창크기를 줄여보면, 아래 그림 처럼 수직으로 타임라인을 표시하도록 변경이 됩니다.사용 방법은 아래와 같습니다.

영상 이나 PPT 에서 배경 음악등이 필요할때저작권 신경쓸 필요 없이 AI 에서 만들어 달라고 할수 있는 사이트가 있어 소개해 드립니다.사이트 로그인하고(전 구글 아이디로 로그인했습니다.) 프롬프트에 만들고 싶은 내용을 치면 됩니다.또는 참고 이미지, 참고할 오디오를 첨부할 수도 있습니다.그럼 생성 되고, 얼마 후 몇곡이 나타납니다.다운로드도 가능하니 다운로드 받으시면 됩니다.근데 무료 플랜은월 4곡 다운로드 가능합니다.자주 사용하지 않는다면, 무료 플랜으로도 충분할 것 같습니다.

카운터가 올라가는 애니메이션을 만들어주는 js 입니다.가입자 수, 판매 수 등을 노출할때 아주 좋은 JS 입니다.targetID 에 노출할 곳의 아이디를 넣고 5234 는 최종 올라갈 수 입니다.이렇게만 하셔도 되며,다양한 옵션이 있으니 옵션도 사용해 보시기 바랍니다.위 옵션을 번역한 내용입니다. 참고하세요~