두 가지 컬러 조합 추천 사이트

오늘은 두 가지 컬러 조합 추천 해주는 사이트에 대해 알려 드리도록 하겠습니다. 여러 디자인에 활용 가능한 2가지 컬러를 시각적으로 보여주며, 해당 색상의 색상 코드 번호도 제공해 줍니다. 또한 CSS 그러데이션 버튼 및 여러 색상의 코드를 제공해 줍니다. 평소에 컬러 조합에 자신이 없으신 분은 사이트에서 추천하는 컬러 조합으로 디자인을 해보십시오.

2 Color Combinations

시각적인 디자인을 만들는 데 사용할 수 있는 두 가지의 색상의 정보를 제안 추천 해주는 사이트입니다. 무수히 많은 컬러 조합을 추천해 주며, 개발자 모드를 통해 해당 박스를 가져와 html에서 활 용 하실 수 있습니다.

아래는 사이트에서 추천하는 디자인 소스코드 입니다. 잘 활용하십시오.

<div class="flex-1 p-2">
      <div class="flex flex-col rounded-lg shadow-lg" style="background-color: #F9EBDE">
        <div class="flex flex-col p-10">
          <div class="mb-8 text-6xl font-body" style="line-height: 50px; color: #815854"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
            여기에 멋진 헤드라인이 있습니다.
          </font></font></div>
          <div class="mb-8" style="color: #815854"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
            Lorem Ipsum은 단순히 인쇄 및 조판 업계의 더미 텍스트입니다. </font><font style="vertical-align: inherit;">Lorem Ipsum은 1500년대 이후 업계의 표준 더미 텍스트였습니다. 알 수 없는 인쇄업자가 활자 갤리를 가져와 활자 표본 책을 만들기 위해 뒤섞었습니다.
          </font></font></div>
          <div>
            <button style="background-color: #815854; color: #F9EBDE" class="flex h-10 px-6 rounded-full outline-none" aria-label="테스트 버튼">
              <svg xmlns="http://www.w3.org/2000/svg" class="self-center mr-2" width="32" height="32" viewBox="0 0 24 24" strokewidth="1.5" stroke="currentColor" fill="none" strokelinecap="round" strokelinejoin="round">
                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                <line x1="12" y1="12" x2="12" y2="12.01"></line>
                <path d="M14.828 9.172a4 4 0 0 1 0 5.656"></path>
                <path d="M17.657 6.343a8 8 0 0 1 0 11.314"></path>
                <path d="M9.168 14.828a4 4 0 0 1 0 -5.656"></path>
                <path d="M6.337 17.657a8 8 0 0 1 0 -11.314"></path>
                </svg>
              <span class="self-center"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">단추</font></font></span>
            </button>
          </div>
        </div>
        <div style="background-color: #815854; color: #F9EBDE" class="p-3 px-10 rounded-b-lg"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
          Lorem Ipsum은 단순히 인쇄 및 조판의 더미 텍스트입니다...
        </font></font></div>
      </div>
    </div>