Individual skill

split-layout-technical

Create a technical split-screen design system with dual panels, fine frame lines, mono metadata, quiet editorial typography, and premium inset surfaces.

agent-skills/web-design/split-layout-technical/SKILL.md

Read pinned source

Source commit 5ea1661a0e05d82b054553daaa6baf6d0233c33c

What was checked

Matches the observed repository HEAD: Yes
Scanner rules are current: Yes
Repository scan complete: No
Skill scan complete: No
Observed behavior: Network or broad shell
Last checked: Nov 9, 2026

These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.

Install this skill

Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.

An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.

Repository context

Repository stars (not skill ratings): 7,330
Repository last updated: Nov 8, 2026
License: MIT

Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.

design Derived category
writing Derived category

Files and excerpt

File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.

Browse files

SKILL.mdcore · 4,258 bytes
demo/PROMPT.mddoc · 3,464 bytes
demo/assets/page-01-65695f80-23f9-46ee-8487-cbb6c93cc48b-3840w.webpasset · 536,390 bytes
demo/assets/page-02-724142aa-44a6-48d3-9cf3-761e00d05b78-1600w.jpgasset · 989,406 bytes
demo/assets/page-03-4734259a-bad7-422f-981e-ce01e79184f2-1600w.jpgasset · 44,753 bytes
demo/assets/page-04-005600e5-f6ab-4e59-bc86-eaeb02797dfa-1600w.jpgasset · 728,581 bytes
demo/assets/page-05-e534354d-c5f2-4399-a1d9-2f50338e8c47-1600w.jpgasset · 85,289 bytes
demo/assets/page-06-fb6415fd-bf4d-4ccf-8e9d-7ab445e99207-1600w.jpgasset · 201,962 bytes
demo/assets/source-preview.jpgasset · 139,542 bytes
demo/index.htmlasset · 45,479 bytes
demo/preview.jpgasset · 98,900 bytes
demo/source.jsonasset · 4,538 bytes

Read excerpt


# Split Layout Technical Skill

## Use When
- Create a technical split-screen design system with dual panels, fine frame lines, mono metadata, quiet editorial typography, and premium inset surfaces.

## Workflow

## Scope
- Apply this as a full-page layout and design-system direction when the interface should be organized into two clear panels or halves.
- Use it for product pages, showcases, portfolios, editorial-tech layouts, or concept presentations that benefit from a disciplined split-screen structure.
- This is a layout system first: it should control framing, spacing, typography, metadata treatment, and panel behavior, not just add a vertical divider.

## Visual target
- Build the page around a strong split layout, usually two equal or near-equal vertical panels on desktop, with each side carrying a distinct role.