반응형

    그라디언트 사용하기

    그라디언트 사용하기

    안녕하세요 밤구름 입니다. 이번 포스팅은 유튜버 존코바님의 그라디언트 이쁘게 쓰는 팁을 보고 정리한내용입니다.

    쉽고 예쁜 디자인 만드는 그라디언트 한번 같이 공부해 봅시다.

     

    그라디언트란?

    그라디언트란 두가지 이상의 색을 섞어 만든것으로 신선하며 두가지 이상 색이 섞인 것을 그라디언트라고 한다.

     

    그라디언트 사용법

    이 영상에 알려주는 사용법은 크게 4가지가 있습니다.

    1.유사색 사용하기
    2.파스텔톤 사용하기
    3.HUE를 사용하여 색상고르기
    4.프리셋 사용하기

    하나씩 알아보도록 하겠습니다.

    1.유사색 사용하기

    그라디언트를 만들때에는 색을 간단하게 사용하는 것이 좋습니다. 색을 섞을 때에는 유사색을 사용하여 차이가 크게 안나는 색을 섞어 만드는 것이 이쁘며 좋은 색이 나올 수 있습니다.

    보색계열의 색을 섞는다면 색의 차이가 너무 커서 이쁜 색이 나올 확률이 적습니다.

    2.파스텔톤 사용하기

    그라디언트를 만드는 두 번째 팁 파스텔톤을 이용하는 것입니다. 색상의 톤을 낮춰 파스텔톤의 느낌을 주면 이쁜 그라디언트를 만들 수 있습니다. 눈의 피로도 적습니다.

    3.HUE 사용하여 색상 고르기

    그라디언트를 만드는 세 번재 팁 HUE를 사용하여 색상을 바꾸는 것입니다.

    그라디언트를 완성한뒤에 색상을 고르기 힘들다면 HUE를 사용하여 색을 바꿔보는 것을 사용해보라고 영상에서는 말한다.

    4.프리셋 사용하기

    그라디언트를 만드는 네 번재 팁 프리셋을 이용하는 것입니다.

    다른 사람들이 만들어 놓은 색을 가져와 사용하는 것 또한 방법입니다.

    아래의 3개의 사이트는 그라디언트와 관련된 정보를 얻는 사이트 입니다. 

    코딩을 하시는 분이라면 제일 아래에 잇는 사이트를 이용하여 css의 정보를 얻으시는 것을 추천드립니다.

     

     

    Free Gradients Collection by itmeo.com

    Free collection of 180 background gradients that you can use as content backdrops in any part of your website.

    webgradients.com

     

     

    Blend—Create and customize beautiful CSS3 gradients.

    Blend—Create and customize beautiful CSS3 gradients.

    www.colinkeany.com

     

     

    uiGradients - Beautiful colored gradients

    uiGradients is a handpicked collection of beautiful color gradients for designers and developers.

    uigradients.com

     

    그라디언트 사용하기 영상

     

     

    반응형

    'Design[디자인] > 이론' 카테고리의 다른 글

    심플한 디자인을 만드는 법칙  (2) 2022.06.27
    • 네이버 블러그 공유하기
    • 네이버 밴드에 공유하기
    • 페이스북 공유하기
    • 카카오스토리 공유하기