Skills
.Work. You
Rest

masonry

Community

Design dynamic masonry layouts.

Design & Creative#design#SEO#layout#portfolio#gallery#masonry
Authorkostja94
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill helps users design, optimize, and audit masonry (Pinterest-style) layouts for content display, especially when dealing with items of varying heights.

Core Features & Use Cases

  • Layout Guidance: Provides clear distinctions between masonry, grid, bento, and carousel layouts.
  • Implementation Advice: Offers insights into CSS columns, JavaScript libraries, and CSS Grid for masonry implementation.
  • SEO Considerations: Addresses critical SEO challenges like crawlability with infinite scroll and lazy loading in masonry layouts.
  • Use Case: A user wants to create a visually appealing portfolio website with images of different aspect ratios. This Skill will guide them on structuring the masonry layout, implementing it efficiently, and ensuring it's crawlable by search engines.

Quick Start

Guide me on how to implement a masonry layout for a gallery of images with varying heights.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: masonry
Download link: https://github.com/kostja94/marketing-skills/archive/main.zip#masonry

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.