2017년 아름다운 그라데이션을 사용자가 직접 만드는 grabient
ㅁㅁㄸ에서 이번에 정리해드릴 정보는 ‘2017년 아름다운 그라데이션을 사용자가 직접 만드는 grabient’ 입니다.
다양한 정보를 전달해 드리려고 노력하는 블로그!!!
글과 사진 및 이미지 ▶ CopyLeft(C)
◎CopyLeft(C) 는 공유는 하시되 복사 붙여넣기가 아니라 내용을 응용하여 작성해서 가져가셔야 된다는 걸 알려 드립니다.
◎사진과 이미지 일부는 퍼온 것도 있음을 밝힙니다.
◎상단의 검색을 이용하면 좀 더 쉽게 검색가능합니다.
2017년 그래픽 과 웹 디자인을 보고 있으면, 발색이 좋고 선명한 그라데이션 컬러가 많이 사용되는것을 볼 수 있습니다.
인스타그램에서도 이런류의 그라데이션이 많이 사용되는데요.
grabient는 웹사이트에서 21가지의 색상을 자신의 취향에 맞게 색상과 모양을 변경하여 사용할 수 있습니다.
버튼을 클릭하면, Internet Explorer 또는 Chrome 등 크로스 브라우저 지원 CSS3 코드를 복사 - 붙여 넣기 할 수 있습니다. 각도 변경과 색상을 추가하는 등 즐거운 기능을 갖춘 꼭 디자인 제작에 활용하고 싶은 서비스라고 생각되네요.
사용법도 쉬운편이라 보시고 금방 사용하실것이라고 생각되네요.
아래는 사이트에서 재공하는 기본 그라데이션 컬러 배색 샘플 예제입니다.
만든 그라데이션 컬러는 Sketch 파일로 다운로드가 가능하기 때문에 디자인에 참고하여 사용하시기 편할것이라고 생각되네요.
앞으로도 계속 추가를 한다고하니 한번 구경해보시는것도 좋을것 같습니다.
사이트 바로가기
그럼 ㅁㅁㄸ에서 정리한 오늘의 ‘2017년 아름다운 그라데이션을 사용자가 직접 만드는 grabient’ 소개를 마치도록 하겠습니다.
관련 글
%23%202017%uB144%20%uC544%uB984%uB2E4%uC6B4%20%uADF8%uB77C%uB370%uC774%uC158%uC744%20%uC0AC%uC6A9%uC790%uAC00%20%uC9C1%uC811%20%uB9CC%uB4DC%uB294%20grabient%0A@%28%24.%uBE14%uB85C%uADF8%20%uC11C%uC2DD%29%5BMarxico%2C%20%uD2F0%uC2A4%uD1A0%uB9AC%2C%20%u3141%u3141%u3138%5D%20%0A%0A%u3141%u3141%u3138%uC5D0%uC11C%20%uC774%uBC88%uC5D0%20%uC815%uB9AC%uD574%uB4DC%uB9B4%20%uC815%uBCF4%uB294%20%20%27%3Cfont%20color%3D%22%23831e1e%22%3E%3Cb%3E2017%uB144%20%uC544%uB984%uB2E4%uC6B4%20%uADF8%uB77C%uB370%uC774%uC158%uC744%20%uC0AC%uC6A9%uC790%uAC00%20%uC9C1%uC811%20%uB9CC%uB4DC%uB294%20grabient%3C/font%3E%27%20%uC785%uB2C8%uB2E4.%0A%0A%0A----------%0A%3Cp%3E%3Cfont%20color%3D%22%23ffffff%22%3E%3Cspan%20style%3D%22background-color%3A%20rgb%28255%2C%2080%2C%2080%29%3B%20color%3A%20rgb%28255%2C%20255%2C%20255%29%3B%22%3E%uB2E4%uC591%uD55C%20%uC815%uBCF4%uB97C%20%uC804%uB2EC%uD574%20%uB4DC%uB9AC%uB824%uACE0%20%uB178%uB825%uD558%uB294%20%uBE14%uB85C%uADF8%21%21%21%3C/span%3E%3C/font%3E%3C/p%3E%0A%uAE00%uACFC%20%uC0AC%uC9C4%20%uBC0F%20%uC774%uBBF8%uC9C0%20%u25B6%20CopyLeft%28C%29%0A%u25CECopyLeft%28C%29%20%uB294%20%uACF5%uC720%uB294%20%uD558%uC2DC%uB418%20%uBCF5%uC0AC%20%uBD99%uC5EC%uB123%uAE30%uAC00%20%uC544%uB2C8%uB77C%20%uB0B4%uC6A9%uC744%20%uC751%uC6A9%uD558%uC5EC%20%uC791%uC131%uD574%uC11C%20%uAC00%uC838%uAC00%uC154%uC57C%20%uB41C%uB2E4%uB294%20%uAC78%20%uC54C%uB824%20%uB4DC%uB9BD%uB2C8%uB2E4.%20%0A%u25CE%uC0AC%uC9C4%uACFC%20%uC774%uBBF8%uC9C0%20%uC77C%uBD80%uB294%20%uD37C%uC628%20%uAC83%uB3C4%20%uC788%uC74C%uC744%20%uBC1D%uD799%uB2C8%uB2E4.%20%0A%u25CE%uC0C1%uB2E8%uC758%20%uAC80%uC0C9%uC744%20%uC774%uC6A9%uD558%uBA74%20%uC880%20%uB354%20%uC27D%uAC8C%20%uAC80%uC0C9%uAC00%uB2A5%uD569%uB2C8%uB2E4.%0A%0A%5BTOC%5D%0A%0A%3Cbr%3E%0A%0A----------%0A2017%uB144%20%uADF8%uB798%uD53D%20%uACFC%20%uC6F9%20%uB514%uC790%uC778%uC744%20%uBCF4%uACE0%20%uC788%uC73C%uBA74%2C%20%uBC1C%uC0C9%uC774%20%uC88B%uACE0%20%uC120%uBA85%uD55C%20%uADF8%uB77C%uB370%uC774%uC158%20%uCEEC%uB7EC%uAC00%20%uB9CE%uC774%20%uC0AC%uC6A9%uB418%uB294%uAC83%uC744%20%uBCFC%20%uC218%20%uC788%uC2B5%uB2C8%uB2E4.%20%0A%uC778%uC2A4%uD0C0%uADF8%uB7A8%uC5D0%uC11C%uB3C4%20%uC774%uB7F0%uB958%uC758%20%uADF8%uB77C%uB370%uC774%uC158%uC774%20%uB9CE%uC774%20%uC0AC%uC6A9%uB418%uB294%uB370%uC694.%0A%0Agrabient%uB294%20%uC6F9%uC0AC%uC774%uD2B8%uC5D0%uC11C%2021%uAC00%uC9C0%uC758%20%uC0C9%uC0C1%uC744%20%uC790%uC2E0%uC758%20%uCDE8%uD5A5%uC5D0%20%uB9DE%uAC8C%20%uC0C9%uC0C1%uACFC%20%uBAA8%uC591%uC744%20%uBCC0%uACBD%uD558%uC5EC%20%uC0AC%uC6A9%uD560%20%uC218%20%uC788%uC2B5%uB2C8%uB2E4.%20%0A%0A%21%5BAlt%20text%5D%28./2017%uB144%20%uC544%uB984%uB2E4%uC6B4%20%uADF8%uB77C%uB370%uC774%uC158%uC744%20%uC0AC%uC6A9%uC790%uAC00%20%uC9C1%uC811%20%uB9CC%uB4DC%uB294%20grabient03.png%29%0A%0A%uBC84%uD2BC%uC744%20%uD074%uB9AD%uD558%uBA74%2C%20Internet%20Explorer%20%uB610%uB294%20Chrome%20%uB4F1%20%uD06C%uB85C%uC2A4%20%uBE0C%uB77C%uC6B0%uC800%20%uC9C0%uC6D0%20CSS3%20%uCF54%uB4DC%uB97C%20%uBCF5%uC0AC%20-%20%uBD99%uC5EC%20%uB123%uAE30%20%uD560%20%uC218%20%uC788%uC2B5%uB2C8%uB2E4.%20%uAC01%uB3C4%20%uBCC0%uACBD%uACFC%20%uC0C9%uC0C1%uC744%20%uCD94%uAC00%uD558%uB294%20%uB4F1%20%uC990%uAC70%uC6B4%20%uAE30%uB2A5%uC744%20%uAC16%uCD98%20%uAF2D%20%uB514%uC790%uC778%20%uC81C%uC791%uC5D0%20%uD65C%uC6A9%uD558%uACE0%20%uC2F6%uC740%20%uC11C%uBE44%uC2A4%uB77C%uACE0%20%uC0DD%uAC01%uB418%uB124%uC694.%0A%3Cbr%3E%0A%uC0AC%uC6A9%uBC95%uB3C4%20%uC26C%uC6B4%uD3B8%uC774%uB77C%20%uBCF4%uC2DC%uACE0%20%uAE08%uBC29%20%uC0AC%uC6A9%uD558%uC2E4%uAC83%uC774%uB77C%uACE0%20%uC0DD%uAC01%uB418%uB124%uC694.%0A%0A%21%5BAlt%20text%5D%28./2017%uB144%20%uC544%uB984%uB2E4%uC6B4%20%uADF8%uB77C%uB370%uC774%uC158%uC744%20%uC0AC%uC6A9%uC790%uAC00%20%uC9C1%uC811%20%uB9CC%uB4DC%uB294%20grabient01.gif%29%0A%0A%uC544%uB798%uB294%20%uC0AC%uC774%uD2B8%uC5D0%uC11C%20%uC7AC%uACF5%uD558%uB294%20%uAE30%uBCF8%20%uADF8%uB77C%uB370%uC774%uC158%20%uCEEC%uB7EC%20%uBC30%uC0C9%20%uC0D8%uD50C%20%uC608%uC81C%uC785%uB2C8%uB2E4.%20%0A%0A%21%5BAlt%20text%5D%28./2017%uB144%20%uC544%uB984%uB2E4%uC6B4%20%uADF8%uB77C%uB370%uC774%uC158%uC744%20%uC0AC%uC6A9%uC790%uAC00%20%uC9C1%uC811%20%uB9CC%uB4DC%uB294%20grabient02.png%29%0A%0A%uB9CC%uB4E0%20%uADF8%uB77C%uB370%uC774%uC158%20%uCEEC%uB7EC%uB294%20Sketch%20%uD30C%uC77C%uB85C%20%uB2E4%uC6B4%uB85C%uB4DC%uAC00%20%uAC00%uB2A5%uD558%uAE30%20%uB54C%uBB38%uC5D0%20%uB514%uC790%uC778%uC5D0%20%uCC38%uACE0%uD558%uC5EC%20%uC0AC%uC6A9%uD558%uC2DC%uAE30%20%uD3B8%uD560%uAC83%uC774%uB77C%uACE0%20%uC0DD%uAC01%uB418%uB124%uC694.%20%0A%0A%uC55E%uC73C%uB85C%uB3C4%20%uACC4%uC18D%20%uCD94%uAC00%uB97C%20%uD55C%uB2E4%uACE0%uD558%uB2C8%20%uD55C%uBC88%20%uAD6C%uACBD%uD574%uBCF4%uC2DC%uB294%uAC83%uB3C4%20%uC88B%uC744%uAC83%20%uAC19%uC2B5%uB2C8%uB2E4.%20%0A%0A%3Cbr%3E%0A%60%60%60%0A%uBC14%uAFD4%20%3Ccenter%3E%3Ca%20class%3D%22btn%20btn-1%22%20href%3D%22https%3A//www.grabient.com/%22%20target%3D%22_blank%22%3E%uC0AC%uC774%uD2B8%20%uBC14%uB85C%uAC00%uAE30%3C/a%3E%3C/center%3E%0A%60%60%60%0A%3Cbr%3E%0A%0A%0A%0A%uADF8%uB7FC%20%u3141%u3141%u3138%uC5D0%uC11C%20%uC815%uB9AC%uD55C%20%uC624%uB298%uC758%20%20%27%3Cfont%20color%3D%22%23831e1e%22%3E%3Cb%3E2017%uB144%20%uC544%uB984%uB2E4%uC6B4%20%uADF8%uB77C%uB370%uC774%uC158%uC744%20%uC0AC%uC6A9%uC790%uAC00%20%uC9C1%uC811%20%uB9CC%uB4DC%uB294%20grabient%3C/font%3E%27%20%20%uC18C%uAC1C%uB97C%20%uB9C8%uCE58%uB3C4%uB85D%20%uD558%uACA0%uC2B5%uB2C8%uB2E4.%20%0A%0A%0A----------%0A**%uAD00%uB828%20%uAE00**%0A*%20%5BHTML%20%uC0C9%uC0C1%uD45C%20%28Color%20Palette%29%5D%28http%3A//mmtt.kr/55%29%0A*%20%5B%uC6F9%20%uB514%uC790%uC774%uB108%uAC00%20%uC0AC%uC6A9%uD558%uBA74%20%uC88B%uC744%20%uD06C%uB86C%20%uD655%uC7A5%uD504%uB85C%uADF8%uB7A8%20%uBAA8%uC74C%5D%28http%3A//mmtt.kr/119%29
