Creative Tim UICreative Tim UI

Dark moody hero with background image and social buttons - shadcn/ui

PRO

In this block example, the color palette is dark and moody, with the image predominantly featuring dark browns and blacks, creating a sophisticated/elegant atmosphere. The hero includes social media icons, inviting further engagement.

Preview

Component Details

ID
hero-17
Type
Block
Access
PRO
Category
Hero
Published
3 Apr 2026

Files Included

  • app/hero-17/page.tsx
  • components/creative-tim/blocks/hero-17.tsx

Components Used

Explore More Blocks

Banner
BannerAttention-grabbing banner components for React and Next.js. Build notification banners, promotional headers, announcement bars, and call-to-action banners with dismissible options.
Stats
StatsProfessional statistics and metrics components for React and Next.js. Build data showcases, KPI dashboards, achievement displays, growth metrics, and performance indicators with customizable layouts and dark theme variations.
Pages
PagesComplete, ready-to-use full-page layouts for React and Next.js. Drop in a full page — dashboards, management views, and multi-section layouts composed from multiple blocks. Install with one command and customize to your needs.
Sidebar
SidebarProfessional sidebar navigation and menu components for React and Next.js. Build dashboard sidebars, app navigation, crypto wallets, calendar views, task managers, and feature-rich sidebar layouts with customizable content.
Calendar
CalendarProfessional calendar and scheduling components for React and Next.js. Build event calendars, weekly schedules, daily planners, and event creation forms with date pickers and time management.
Feature
FeatureProfessional feature showcase components for React and Next.js. Build product features, service highlights, benefits sections, and feature comparison layouts with icons, images, and call-to-action elements.
Coming Soon
Coming SoonProfessional coming soon and launching soon page components for React and Next.js. Build launch pages with countdown timers, email subscriptions, video backgrounds, app previews, and notification signup forms.
Card
CardVersatile card layout components for React and Next.js. Build content cards with avatars, images, backgrounds, call-to-action buttons, and various layouts for displaying information in organized containers.