요즘은 웹페이지를 디자인할때 대부분 CSS로 많이들 합니다.
예전에는 웹요소들을 만들때 Photoshop을 이용하곤 했습니다. 버튼이나 바, 아이콘등을 Photoshop으로 만들고 웹페이지에 적용 시겼죠.
하지만 지금은 CSS3로 거의 모든 요소들을 만들 수 있기도 하고, 반응형 웹사이트를 만들경우 이미지 요소는 레이아웃을 흩어지게 하기 때문에 잘 사용하지 않습니다.
그럼에도 불구하고 백그라운드의 패턴 같은 경우는 CSS로 만드는 것보다는 이미지를 사용하는 것이 웹페이지를 더욱 멋지게 만들 수 있습니다.
그래서 오늘은 background의 이미지 패턴 사이트 1곳과 CSS3로 만들어진 패턴사이트 1곳, 그리고 웹상에서 스스로 패턴을 만들어 볼 수 있는 곳 1곳을 소개해 드리겠습니다.
현재 387개의 패턴이 등록되어 있으며 Preview 버튼을 클릭하면 웹상에서 바로 적용된 모습을 확인해 볼 수 있습니다. 꽤 괜찮은 것들이 많이 있으니 한번 구경해 보세요.
CSS3 패턴 갤러리 사이트 : http://lea.verou.me/css3patterns/
패턴이 많이 있지는 않지만 적용된 모습을 즉시 볼 수 있고, CSS code를 바로 복사할 수 있으니 자신의 홈페이지에 금방 테스트 해 볼수 있겠죠.
CSS패턴 만들기 사이트 : http://www.patternify.com/
아래 사진에서 보듯이 자신이 클릭해가면서 색상, 크기, 투명도 등을 조절할 수 있습니다. Preview 창을 보면서 만들 수 있으니 편해요 png파일로 다운로드 가능합니다.
즐거운 하루 되세요.