일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- 쇼핑몰
- #이미지
- 홈페이지
- #jQuery
- #업종별
- javascript
- #happycgi
- #동영상
- #솔루션
- 웹솔루션
- 게시판
- #해피CGI
- 사이트제작
- #CSS
- php
- CSS
- CGIMALL
- #cgimall
- #쇼핑몰
- 솔루션
- #image
- 해피씨지아이
- #웹솔루션
- #홈페이지제작
- jquery
- #홈페이지
- happycgi
- 해피CGI
- 홈페이지제작
- #뉴스
- Today
- Total
웹솔루션개발 22년 노하우! 해피CGI의 모든것
그라디언트 컬러코드를 추천하고, 실시간으로 컬러를 변경해서 매칭해 볼 수 있는 유용한 사이트를 소개합니다. 각 카드의 하단에있는 숫자를 클릭하면 색상 코드를 복사 할 슬라이드를 조정하면 특정 범위 내에서 조정도 할 수있게되어 있습니다. 또한 각 카드에 호버하면 아이콘이 표시되고 각 컬러 코드의 변경 CSS 코드의 복사 Adobe XD와 Sketch에서 사용할 수있는 소재의 다운로드 수 있습니다.
멋진 그라데이션 컬러를 알고 싶을 때 유용한 사이트를 소개 해 드립니다. 그라디언트 기본적인 색상의 목록이 포함되어 있기 때문에 빠르게 선택 색상 코드와 CSS로 구현하는 코드를 확인할 수 있습니다. 또한 직접 원하는대로 조정 한 다음 코드 출력은 물론 디자인에 사용할 소재로 다운로드 할 수 있도록도되어 있습니다.
위처럼 도메인의 앞글자만 입력하면 자동 완성을 해주는 jquery js 입니다. 위처럼 간단히 적용 되며, 자동 완성시킬 도메인을 위의 domains 부분에 적어 두시면 되겠습니다. 국내에서는 naver.com , nate.com 등을 적어 두시면 되겠습니다.
현재 4.4.1 버전으로 지속적으로 업데이트 되고 있는 차트 JS 입니다. https://www.chartjs.org/docs/latest/getting-started/ 위 링크의 스타트 설명을 따라 하다보면 쉽게 적용이 가능합니다. 다양한 차트와 여러 애니메이션 효과도 줄 수 있으니 차트가 필요하시다면 사용을 추천 드립니다.
다양한 목소리를 제공하는 TTS 제공 사이트 CLOVA Dubbing 입니다. https://clovadubbing.naver.com/ 무료로 5개 프로젝트까지 개설이 가능 합니다. 프로젝트 개설시에는 아래와 같은 인터페이스로 노출이 됩니다. 동영상이나 PDF 이미지를 추가 하여, 더빙 및 효과음을 추가 가능 합니다. 더빙내용은 Text로 입력을 하면 되고, 목소리를 선택 하여 미리듣기 혹은 더빙추가를 할 수 있습니다. 추가된 더빙을 적절한 위치에 드래그해서 배치를 하여 이용을 할 수 있겠습니다. 완성된 파일은 다운로드 기능을 이용해서 다운로드 하여 사용이 가능 합니다.
Line, Area, Bar 등의 다양한 차트를 지원하는 차트를 손쉽게 구현 할 수 있는 TOAST UI Chart 입니다. https://ui.toast.com/tui-chart 지원되는 차트는 아래 이미지를 참고 하시면 되겠습니다. 한국어 메뉴얼은 아래 페이지를 통해 접속 하시면 되고, 각 차트별로 메뉴얼을 볼 수 있습니다. https://github.com/nhn/tui.chart/blob/main/docs/ko/README.md 최신버전 및 버전별 소스 다운로드는 https://github.com/nhn/tui.chart/releases 페이지에서 제공 됩니다.
kslider는 이미지를 우아한 방식으로 표현하기 위해 만들어진 초소형, 완전 반응형, 사용하기 쉬운 jQuery 기반 슬라이더입니다. 화면 크기에 따라 높이/너비를 자동으로 조정합니다. 호버링 시 탐색 화살표를 자동으로 표시하거나 숨깁니다. Auto는 img의 속성에서 이미지 캡션을 만듭니다.alt 특정 속도로 이미지 간에 자동 전환됩니다. 회전목마와 같은 무한 루프. 와 같은 기능이 있습니다. 사용방법은 아래와 같습니다.
color-picker.js 는 웹 페이지에 HEX 색상 선택기를 추가할 수 있는 가볍고 구현하기 쉬운 jQuery 플러그인입니다. 색상 입력에 초점이 맞춰지면 간결하고 깨끗한 색상 선택기 팝업이 표시되므로 사용자가 선택한 미리 정의된 색상 집합이 포함된 팔레트에서 색상을 선택할 수 있습니다. 사용방법은 아래와 같습니다.
원하는 색상코드 입력 후 채도 단계에 따라 자동으로 색상코드를 생성하는 색상 생성기 원하는 색상을 입력한 후 채도(밝기) 단계를 선택하면 해당 색상코드가 자동으로 생성됩니다. 색상코드 생성 시 hex, HSL, rgb 중 포맷 선택이 가능하며, 선택한 포맷에 따라 코드값이 자동 생성됩니다. 컨셉 색상을 지정하고, 다양한 밝기로 자동으로 생성되니 , 편리하게 이용할 수 있네요.
16진수 색상코드나 RGB 색상코드가 아닌 CSS에 지정된 색상명을 확인하고 조합 사용이 가능한 handy colors 정리된 정보입니다. 색상 편집기를 실행할 필요없이, css로 지정된 색상명을 바로 입력하여 사용이 가능하며, 본연의 색상을 조합하여 사용이 가능하네요. 또한 여러 테마별 색상 팔레트도 제공하여, 컨셉에 따른 색상 조합을 선택해서 CSS에 지정된 색상명으로 사용이 가능하네요. 색상명으로 구성하는걸 선호하면 좋은 자료네요.^^