에루샤
erusya
Back-end Developer
Web Geek
Anime Otaku
에루샤 프로필 이미지
개발

CSS 그라데이션, 그림자 시뮬레이터 사이트

385 views as of .
가끔 퍼블지원 하다가 그라데이션이나 그림자 시뮬레이터로 빠르게 제작할때 보는 사이트들을 나열해 보았다.

CSS 그라디언트

CSS Gradient — Generator, Maker, and Background
CSS Gradient — Generator, Maker, and Background
As a free css gradient generator tool, this website lets you create a colorful gradient background for your website, blog, or social media profile.
https://cssgradient.io/

본문 이미지

웹페이지에서 직관적으로 그라데이션을 시각화하고 그 코드를 얻어낼 수 있는 사이트이다.

공대감성보다는 디자인 감성으로 만들어진 사이트인데, 간단한 리니어 그라이데이션과 중간중간에 브레이크 포인트 넣기 편하게 설계 되어있다.


CSS 박스 그림자

CSS Box shadow generator | CSSGENERATOR.PL
CSS Box shadow generator | CSSGENERATOR.PL
CSS BOX SHADOW GENERATOR | An easy to use tool that allows you to generate ready CSS rules. Adjust values and copy the finished code.
https://cssgenerator.pl/en/box-shadow-generator/

본문 이미지

이번엔 박스 그림자를 직관적으로 제어할 수 있는 페이지이다.
슬라이더를 이리저리 움직이면서 내가 원하는 모양이 될때까지 변경한 후 코드를 복사해 사용할 수 있다.

다만 정확한 값까지 설정하려하지말고 그림자가 적용이된 코드 껍데기를 얻은 후 자기가 사용할 CSS에서 미세조정하는게 더 정확하다.

#유용한사이트
0 개의 댓글
×