CSS 할로윈 얼굴: 호박

지금까지 CSS로 외계인, 구울, 해골을 만들었습니다. 할로윈에 또 무엇을 만들 수 있을까요? 잭오랜턴 어때요?

호박과 어울리도록 배경색을 주황색으로 변경하는 것으로 시작했습니다.

.minifig_face {
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ff9800; 
    flex-direction: column;
    border: 4px solid black;
}

다음으로 눈의 크기를 변경했습니다. 나는 그들을 더 길고 타원형으로 만들었습니다. 호박 껍질에 새겨진 모양을 만들기 위해 테두리 스타일을 단색에서 이중으로 변경했습니다. 마지막으로 배경색을 호박 내부처럼 보이도록 변경했습니다.

그런 다음 입에 눈 모양을 사용하고 코를 완전히 떨어뜨리기로 결정했습니다.

.eyes {
    height: 195px;
    width: 145px;
    background: #FFF8E1;
    border-radius: 100%;
    border: double 4px black;
    margin:-10px 10px 0px 10px;
    display: flex;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

잭오랜턴이 있습니다. 그러나 색상을 빠르게 변경하고 눈에서 동공과 테두리를 제거합니다. 하울링 고스트를 줍니다.

다른 CSS 생성의 갤러리입니다.

두개골


악귀



외계인



비늘을 가진 외계인

    background-image: url(fish-net.png), radial-gradient(rgba(255, 204, 0, 0.01), rgb(253, 245, 192)); 

이것은 Cody Pearce의 .

CSS로 멋진 것을 만들어 본 적이 있습니까? 그것을 공유하십시오.

-$JarvisScript 자식 푸시