구성 요소 팔로우 버튼 Follow Button 구성 요소

Follow Button 구성 요소

어두운 테마를 지원하는 대시보드를 위한 Neumorphism 스타일의 Follow Button.

미리 보기

HTML 코드

<div class="flex justify-center items-center h-screen bg-gray-800 dark:bg-gray-900">
    <button class="relative inline-flex items-center justify-center p-4 bg-gray-200 dark:bg-gray-700 rounded-full shadow-lg transition-transform transform hover:scale-105 active:scale-95 dark:shadow-inner shadow-gray-300 ">
        <span class="absolute inset-0 rounded-full bg-gradient-to-r from-pink-400 via-red-500 to-yellow-500 opacity-20 blur transition-all duration-500"></span>
        <span class="relative text-white font-bold text-lg">
            Follow
        </span>
    </button>
</div>

관련 구성 요소

Follow Button 구성 요소

마이크로 인터랙션, 세피아/갈색 색 구성표, 반응형 디자인 및 다크 모드 지원을 갖춘 복잡한 '팔로우' 버튼 구성 요소로 블로그/콘텐츠 플랫폼에 적합합니다.

열다

Follow Button 구성 요소

전자 상거래 애플리케이션에 적합한 보색 구성표를 사용하여 glassmorphism 효과로 설계된 복잡한 follow button 구성 요소로, 반응형 디자인과 어두운 테마 지원을 특징으로 합니다.

열다

머티리얼 디자인 팔로우 버튼

반응형, 단색의 Material Design 팔로우 버튼 구성 요소로, 다크 모드를 지원합니다.

열다