Take control of your post headers with custom colors and images
I’m excited to announce a new feature that allows you to fully customize your post headers with colors, images, and overlays. This gives you the flexibility to create headers that match your content and branding perfectly.
With the new header settings, you can customize:
You can set these styles in your post’s front matter or site-wide in your _config.yml file.
header:
text: "rgba(255,255,255,0.7)" # Text color
accent: "#ffffff" # Accent color
header:
color: "#4051b5" # Solid background color (optional)
header:
image: /media/background-img.jpg # Background image (optional)
overlay: rgba(0, 0, 0, 0.5) # Overlay for background image (optional)
color alone for a solid color background.image alone to use an image as the background.image and overlay to apply a transparent overlay on top of the image for better text readability.For full configuration details, refer to the Set Custom Header Colors section in the documentation.
Sometimes a post just needs a little extra flair at the top. Maybe it’s a splash of your brand color, or a photo that sets the mood before a reader even starts. Now you can do that—no fuss, just set the color or drop in an image. We’ve already had fun playing with it; hope you do too.
