Design Blocks
12 blocks for creating visually stunning pages. Add animations, sliders, icons, and decorative elements.
Counter
Animated numbers that count up when visitors scroll to them.
What You Can Do
- Display statistics with animated counting
- Add prefix ($) and suffix (%, +, etc.)
- Control animation speed
- Show decimal numbers
Settings
| Setting | Options | Example |
|---|---|---|
| Start Number | Any number | 0 |
| End Number | Any number | 500 |
| Prefix | Text | $ |
| Suffix | Text | + |
| Duration | Milliseconds | 2000 |
| Decimal Places | 0-3 | 0 |
Best For
- “500+ Happy Customers” statistics
- Years of experience
- Projects completed
- Revenue figures
Countdown
Timer counting down to a specific date.
What You Can Do
- Count down to any future date
- Show days, hours, minutes, seconds
- Display message when timer ends
- Style inline or stacked layout
Settings
| Setting | Options | Recommended |
|---|---|---|
| Target Date | Date picker | Your event date |
| Show Days | Yes/No | Yes for events > 1 day |
| Show Seconds | Yes/No | Yes for urgency |
| Expiry Message | Text | “Sale has ended!” |
| Layout | Inline, Stacked | Stacked for impact |
Best For
- Product launches
- Sale endings
- Event countdowns
- Webinar registration urgency
Divider
Decorative separator between sections.
What You Can Do
- Choose line styles (solid, dashed, dotted)
- Add icon or text in the center
- Control width and alignment
- Match your brand colors
Settings
| Setting | Options |
|---|---|
| Style | Solid, Dashed, Dotted, Double |
| Width | Percentage |
| Alignment | Left, Center, Right |
| Icon | Optional icon in center |
| Text | Optional text label |
Best For
- Section breaks
- Content separation
- Visual hierarchy
Flip Box
Two-sided card that flips on hover to reveal more content.
What You Can Do
- Design front and back sides differently
- Add icons, titles, descriptions
- Include button on back side
- Choose horizontal or vertical flip
Settings
| Setting | Options |
|---|---|
| Front Side | Icon, Title, Description |
| Back Side | Icon, Title, Description, Button |
| Flip Direction | Horizontal, Vertical |
| 3D Depth | Slider |
| Animation Speed | Milliseconds |
Best For
- Feature showcases
- Service descriptions
- Team member cards
- Interactive portfolios
Heading
Styled headings with decorative options.
What You Can Do
- Add main heading with subheading
- Include decorative separators
- Choose heading level for SEO
- Style typography completely
Settings
| Setting | Options |
|---|---|
| Heading Text | Your title |
| Heading Tag | H1-H6 |
| Subheading | Optional text below |
| Separator | None, Line, Icon |
| Alignment | Left, Center, Right |
Best For
- Section titles
- Page headers
- Feature introductions
Icon Box
Icon paired with title and description.
What You Can Do
- Choose from hundreds of icons
- Position icon top, left, or right
- Link the entire box
- Style icon size and colors
Settings
| Setting | Options |
|---|---|
| Icon | Icon picker |
| Icon Position | Top, Left, Right |
| Title | Text |
| Description | Text |
| Link URL | Optional |
Best For
- Feature lists
- Service highlights
- Process steps
- Contact information
Shape
Decorative SVG dividers between sections.
What You Can Do
- Add wave, curve, triangle, or arrow shapes
- Place at top or bottom of sections
- Flip horizontally or vertically
- Match your section colors
Settings
| Setting | Options |
|---|---|
| Shape Type | Wave, Curve, Triangle, Tilt, Arrow |
| Position | Top, Bottom |
| Flip Horizontal | Yes/No |
| Flip Vertical | Yes/No |
| Height | Pixels |
| Color | Color picker |
Best For
- Section transitions
- Visual interest
- Professional page breaks
Slider
Image and content slider for hero sections.
What You Can Do
- Add unlimited slides
- Include images, text, and buttons
- Choose transition effects
- Enable autoplay
Settings
| Setting | Options |
|---|---|
| Slides | Add multiple |
| Transition | Slide, Fade |
| Autoplay | Yes/No |
| Duration | Milliseconds |
| Navigation | Arrows, Dots, Both |
| Loop | Yes/No |
Best For
- Hero sections
- Image galleries
- Feature showcases
- Announcements
Social Icons
Social media profile links.
What You Can Do
- Add icons for any social platform
- Choose filled, outline, or rounded styles
- Use brand colors or custom colors
- Open links in new tab
Settings
| Setting | Options |
|---|---|
| Platforms | Add multiple |
| Icon Style | Filled, Outline, Rounded |
| Size | Small, Medium, Large |
| Colors | Brand colors, Custom |
| New Tab | Yes/No |
Best For
- Footer social links
- Author profiles
- Contact sections
Star Rating
Display star ratings for reviews and ratings.
What You Can Do
- Show 0-5 stars (with decimals)
- Choose star, heart, or custom icons
- Display rating number beside stars
- Style filled and empty colors
Settings
| Setting | Options |
|---|---|
| Rating | 0-5 (decimals allowed) |
| Icon Style | Stars, Hearts, Custom |
| Size | Pixels |
| Show Number | Yes/No |
Best For
- Product ratings
- Testimonial ratings
- Review displays
Team Carousel
Team members in scrolling carousel format.
What You Can Do
- Add unlimited team members
- Include photo, name, role, bio
- Add social links per member
- Control slides visible and autoplay
Settings
| Setting | Options |
|---|---|
| Members | Add multiple |
| Member Fields | Photo, Name, Role, Bio, Social |
| Slides Per View | 1-6 |
| Autoplay | Yes/No |
| Navigation | Arrows, Dots |
Best For
- About us pages
- Team sections
- Staff directories
Text Rotator
Animated rotating text effect for dynamic headlines.
What You Can Do
- Rotate through multiple words/phrases
- Add static text before and after
- Choose animation type
- Control timing
Settings
| Setting | Options |
|---|---|
| Before Text | Static text |
| Rotating Words | Add multiple |
| After Text | Static text |
| Animation | Type, Fade, Slide |
| Duration | Milliseconds |
Best For
- Hero headlines (“We create [websites/apps/brands]”)
- Dynamic taglines
- Attention-grabbing titles