feat: add chalkboard style and xhs-images previews
- Add chalkboard style to baoyu-xhs-images and baoyu-comic - Update chalkboard style for article-illustrator, cover-image, infographic - Remove tech style from baoyu-xhs-images - Add style and layout preview screenshots for xhs-images - Bump version to 1.9.0 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
|
|
@ -6,7 +6,7 @@
|
||||||
},
|
},
|
||||||
"metadata": {
|
"metadata": {
|
||||||
"description": "Skills shared by Baoyu for improving daily work efficiency",
|
"description": "Skills shared by Baoyu for improving daily work efficiency",
|
||||||
"version": "1.8.0"
|
"version": "1.9.0"
|
||||||
},
|
},
|
||||||
"plugins": [
|
"plugins": [
|
||||||
{
|
{
|
||||||
|
|
|
||||||
15
CHANGELOG.md
|
|
@ -2,6 +2,21 @@
|
||||||
|
|
||||||
English | [中文](./CHANGELOG.zh.md)
|
English | [中文](./CHANGELOG.zh.md)
|
||||||
|
|
||||||
|
## 1.9.0 - 2026-01-20
|
||||||
|
|
||||||
|
### Features
|
||||||
|
- `baoyu-xhs-images`: adds `chalkboard` style—black chalkboard background with colorful chalk drawings for education and tutorial content.
|
||||||
|
- `baoyu-comic`: adds `chalkboard` style—educational chalk drawings on black chalkboard for tutorials, explainers, and knowledge comics.
|
||||||
|
|
||||||
|
### Improvements
|
||||||
|
- `baoyu-article-illustrator`, `baoyu-cover-image`, `baoyu-infographic`: updates `chalkboard` style with enhanced visual guidelines.
|
||||||
|
|
||||||
|
### Breaking Changes
|
||||||
|
- `baoyu-xhs-images`: removes `tech` style (use `minimal` or `notion` for technical content).
|
||||||
|
|
||||||
|
### Documentation
|
||||||
|
- `README.md`, `README.zh.md`: adds style and layout preview galleries for xhs-images (9 styles, 6 layouts).
|
||||||
|
|
||||||
## 1.8.0 - 2026-01-20
|
## 1.8.0 - 2026-01-20
|
||||||
|
|
||||||
### Features
|
### Features
|
||||||
|
|
|
||||||
|
|
@ -2,6 +2,21 @@
|
||||||
|
|
||||||
[English](./CHANGELOG.md) | 中文
|
[English](./CHANGELOG.md) | 中文
|
||||||
|
|
||||||
|
## 1.9.0 - 2026-01-20
|
||||||
|
|
||||||
|
### 新功能
|
||||||
|
- `baoyu-xhs-images`:新增 `chalkboard`(黑板)风格——黑色黑板背景配彩色粉笔绘画,适合教育和教程内容。
|
||||||
|
- `baoyu-comic`:新增 `chalkboard`(黑板)风格——黑色黑板上的教育粉笔画,适合教程、讲解和知识漫画。
|
||||||
|
|
||||||
|
### 改进
|
||||||
|
- `baoyu-article-illustrator`、`baoyu-cover-image`、`baoyu-infographic`:更新 `chalkboard` 风格,增强视觉指南。
|
||||||
|
|
||||||
|
### 破坏性变更
|
||||||
|
- `baoyu-xhs-images`:移除 `tech` 风格(技术内容改用 `minimal` 或 `notion` 风格)。
|
||||||
|
|
||||||
|
### 文档
|
||||||
|
- `README.md`、`README.zh.md`:新增 xhs-images 风格和布局预览图库(9 种风格、6 种布局)。
|
||||||
|
|
||||||
## 1.8.0 - 2026-01-20
|
## 1.8.0 - 2026-01-20
|
||||||
|
|
||||||
### 新功能
|
### 新功能
|
||||||
|
|
|
||||||
22
README.md
|
|
@ -99,7 +99,18 @@ Xiaohongshu (RedNote) infographic series generator. Breaks down content into 1-1
|
||||||
/baoyu-xhs-images 今日星座运势
|
/baoyu-xhs-images 今日星座运势
|
||||||
```
|
```
|
||||||
|
|
||||||
**Styles** (visual aesthetics): `cute` (default), `fresh`, `tech`, `warm`, `bold`, `minimal`, `retro`, `pop`, `notion`
|
**Styles** (visual aesthetics): `cute` (default), `fresh`, `warm`, `bold`, `minimal`, `retro`, `pop`, `notion`, `chalkboard`
|
||||||
|
|
||||||
|
**Style Previews**:
|
||||||
|
|
||||||
|
| | | |
|
||||||
|
|:---:|:---:|:---:|
|
||||||
|
|  |  |  |
|
||||||
|
| cute | fresh | warm |
|
||||||
|
|  |  |  |
|
||||||
|
| bold | minimal | retro |
|
||||||
|
|  |  |  |
|
||||||
|
| pop | notion | chalkboard |
|
||||||
|
|
||||||
**Layouts** (information density):
|
**Layouts** (information density):
|
||||||
| Layout | Density | Best for |
|
| Layout | Density | Best for |
|
||||||
|
|
@ -111,6 +122,15 @@ Xiaohongshu (RedNote) infographic series generator. Breaks down content into 1-1
|
||||||
| `comparison` | 2 sides | Before/after, pros/cons |
|
| `comparison` | 2 sides | Before/after, pros/cons |
|
||||||
| `flow` | 3-6 steps | Processes, timelines |
|
| `flow` | 3-6 steps | Processes, timelines |
|
||||||
|
|
||||||
|
**Layout Previews**:
|
||||||
|
|
||||||
|
| | | |
|
||||||
|
|:---:|:---:|:---:|
|
||||||
|
|  |  |  |
|
||||||
|
| sparse | balanced | dense |
|
||||||
|
|  |  |  |
|
||||||
|
| list | comparison | flow |
|
||||||
|
|
||||||
#### baoyu-infographic
|
#### baoyu-infographic
|
||||||
|
|
||||||
Generate professional infographics with 20 layout types and 17 visual styles. Analyzes content, recommends layout×style combinations, and generates publication-ready infographics.
|
Generate professional infographics with 20 layout types and 17 visual styles. Analyzes content, recommends layout×style combinations, and generates publication-ready infographics.
|
||||||
|
|
|
||||||
22
README.zh.md
|
|
@ -99,7 +99,18 @@ npx add-skill jimliu/baoyu-skills
|
||||||
/baoyu-xhs-images 今日星座运势
|
/baoyu-xhs-images 今日星座运势
|
||||||
```
|
```
|
||||||
|
|
||||||
**风格**(视觉美学):`cute`(默认)、`fresh`、`tech`、`warm`、`bold`、`minimal`、`retro`、`pop`、`notion`
|
**风格**(视觉美学):`cute`(默认)、`fresh`、`warm`、`bold`、`minimal`、`retro`、`pop`、`notion`、`chalkboard`
|
||||||
|
|
||||||
|
**风格预览**:
|
||||||
|
|
||||||
|
| | | |
|
||||||
|
|:---:|:---:|:---:|
|
||||||
|
|  |  |  |
|
||||||
|
| cute | fresh | warm |
|
||||||
|
|  |  |  |
|
||||||
|
| bold | minimal | retro |
|
||||||
|
|  |  |  |
|
||||||
|
| pop | notion | chalkboard |
|
||||||
|
|
||||||
**布局**(信息密度):
|
**布局**(信息密度):
|
||||||
| 布局 | 密度 | 适用场景 |
|
| 布局 | 密度 | 适用场景 |
|
||||||
|
|
@ -111,6 +122,15 @@ npx add-skill jimliu/baoyu-skills
|
||||||
| `comparison` | 双栏 | 对比、优劣 |
|
| `comparison` | 双栏 | 对比、优劣 |
|
||||||
| `flow` | 3-6 步 | 流程、时间线 |
|
| `flow` | 3-6 步 | 流程、时间线 |
|
||||||
|
|
||||||
|
**布局预览**:
|
||||||
|
|
||||||
|
| | | |
|
||||||
|
|:---:|:---:|:---:|
|
||||||
|
|  |  |  |
|
||||||
|
| sparse | balanced | dense |
|
||||||
|
|  |  |  |
|
||||||
|
| list | comparison | flow |
|
||||||
|
|
||||||
#### baoyu-infographic
|
#### baoyu-infographic
|
||||||
|
|
||||||
专业信息图生成器,支持 20 种布局和 17 种视觉风格。分析内容后推荐布局×风格组合,生成可发布的信息图。
|
专业信息图生成器,支持 20 种布局和 17 种视觉风格。分析内容后推荐布局×风格组合,生成可发布的信息图。
|
||||||
|
|
|
||||||
|
After Width: | Height: | Size: 87 KiB |
|
After Width: | Height: | Size: 90 KiB |
|
After Width: | Height: | Size: 162 KiB |
|
After Width: | Height: | Size: 54 KiB |
|
After Width: | Height: | Size: 121 KiB |
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 142 KiB |
|
After Width: | Height: | Size: 174 KiB |
|
After Width: | Height: | Size: 96 KiB |
|
After Width: | Height: | Size: 92 KiB |
|
After Width: | Height: | Size: 43 KiB |
|
After Width: | Height: | Size: 74 KiB |
|
After Width: | Height: | Size: 198 KiB |
|
After Width: | Height: | Size: 189 KiB |
|
After Width: | Height: | Size: 116 KiB |
|
|
@ -1,56 +1,60 @@
|
||||||
# chalkboard
|
# chalkboard
|
||||||
|
|
||||||
Classic classroom chalkboard style for educational content
|
Black chalkboard background with colorful chalk drawing style
|
||||||
|
|
||||||
## Design Aesthetic
|
## Design Aesthetic
|
||||||
|
|
||||||
Classic classroom chalkboard aesthetic with hand-drawn chalk illustrations. Nostalgic educational feel with imperfect, sketchy lines. Colorful chalk creates visual hierarchy while maintaining authentic chalkboard warmth.
|
Classic classroom chalkboard aesthetic with hand-drawn chalk illustrations. Nostalgic educational feel with imperfect, sketchy lines that capture the warmth of traditional teaching. Colorful chalk creates visual hierarchy while maintaining the authentic chalkboard experience.
|
||||||
|
|
||||||
## Background
|
## Background
|
||||||
|
|
||||||
- Color: Chalkboard Black (#1A1A1A) or Dark Green-Black (#1C2B1C)
|
- Color: Chalkboard Black (#1A1A1A) or Dark Green-Black (#1C2B1C)
|
||||||
- Texture: Realistic chalkboard texture with dust and eraser marks
|
- Texture: Realistic chalkboard texture with subtle scratches, dust particles, and faint eraser marks
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
Hand-drawn chalk lettering style with visible chalk texture. Imperfect baseline adds authenticity. White or bright colored chalk for emphasis.
|
||||||
|
|
||||||
## Color Palette
|
## Color Palette
|
||||||
|
|
||||||
| Role | Color | Hex | Usage |
|
| Role | Color | Hex | Usage |
|
||||||
|------|-------|-----|-------|
|
|------|-------|-----|-------|
|
||||||
| Background | Chalkboard Black | #1A1A1A | Primary background |
|
| Background | Chalkboard Black | #1A1A1A | Primary background |
|
||||||
| Alt Background | Green-Black | #1C2B1C | Traditional green |
|
| Alt Background | Green-Black | #1C2B1C | Traditional green board |
|
||||||
| Primary | Chalk White | #F5F5F5 | Main elements |
|
| Primary Text | Chalk White | #F5F5F5 | Main text, outlines |
|
||||||
| Accent 1 | Chalk Yellow | #FFE566 | Highlights |
|
| Accent 1 | Chalk Yellow | #FFE566 | Highlights, emphasis |
|
||||||
| Accent 2 | Chalk Pink | #FF9999 | Secondary highlights |
|
| Accent 2 | Chalk Pink | #FF9999 | Secondary highlights |
|
||||||
| Accent 3 | Chalk Blue | #66B3FF | Diagrams, links |
|
| Accent 3 | Chalk Blue | #66B3FF | Diagrams, links |
|
||||||
| Accent 4 | Chalk Green | #90EE90 | Success, growth |
|
| Accent 4 | Chalk Green | #90EE90 | Success, nature |
|
||||||
| Accent 5 | Chalk Orange | #FFB366 | Warnings, energy |
|
| Accent 5 | Chalk Orange | #FFB366 | Warnings, energy |
|
||||||
|
|
||||||
## Visual Elements
|
## Visual Elements
|
||||||
|
|
||||||
- Hand-drawn chalk illustrations
|
- Hand-drawn chalk illustrations with sketchy, imperfect lines
|
||||||
- Chalk dust effects
|
- Chalk dust effects around text and key elements
|
||||||
- Doodles: stars, arrows, underlines
|
- Doodles: stars, arrows, underlines, circles, checkmarks
|
||||||
- Mathematical formulas
|
- Mathematical formulas and simple diagrams
|
||||||
- Eraser smudges and chalk residue
|
- Eraser smudges and chalk residue textures
|
||||||
- Stick figures and icons
|
- Wooden frame border optional
|
||||||
- Connection lines with hand feel
|
- Stick figures and simple icons
|
||||||
- Checkmarks and annotations
|
- Connection lines with hand-drawn feel
|
||||||
|
|
||||||
## Style Rules
|
## Style Rules
|
||||||
|
|
||||||
### Do
|
### Do
|
||||||
|
|
||||||
- Maintain chalk texture on all elements
|
- Maintain authentic chalk texture on all elements
|
||||||
- Use imperfect hand-drawn quality
|
- Use imperfect, hand-drawn quality throughout
|
||||||
- Add chalk dust and smudge effects
|
- Add subtle chalk dust and smudge effects
|
||||||
- Create hierarchy with color
|
- Create visual hierarchy with color variety
|
||||||
- Include playful annotations
|
- Include playful doodles and annotations
|
||||||
|
|
||||||
### Don't
|
### Don't
|
||||||
|
|
||||||
- Use perfect geometric shapes
|
- Use perfect geometric shapes
|
||||||
- Create clean digital lines
|
- Create clean digital-looking lines
|
||||||
- Add photorealistic elements
|
- Add photorealistic elements
|
||||||
- Use gradients or gloss
|
- Use gradients or glossy effects
|
||||||
- Make it look computerized
|
- Make it look computerized
|
||||||
|
|
||||||
## Best For
|
## Best For
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,61 @@
|
||||||
|
# chalkboard
|
||||||
|
|
||||||
|
Black chalkboard background with colorful chalk drawing style
|
||||||
|
|
||||||
|
## Design Aesthetic
|
||||||
|
|
||||||
|
Classic classroom chalkboard aesthetic with hand-drawn chalk illustrations. Nostalgic educational feel with imperfect, sketchy lines that capture the warmth of traditional teaching. Colorful chalk creates visual hierarchy while maintaining the authentic chalkboard experience.
|
||||||
|
|
||||||
|
## Background
|
||||||
|
|
||||||
|
- Color: Chalkboard Black (#1A1A1A) or Dark Green-Black (#1C2B1C)
|
||||||
|
- Texture: Realistic chalkboard texture with subtle scratches, dust particles, and faint eraser marks
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
Hand-drawn chalk lettering style with visible chalk texture. Imperfect baseline adds authenticity. White or bright colored chalk for emphasis.
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Color | Hex | Usage |
|
||||||
|
|------|-------|-----|-------|
|
||||||
|
| Background | Chalkboard Black | #1A1A1A | Primary background |
|
||||||
|
| Alt Background | Green-Black | #1C2B1C | Traditional green board |
|
||||||
|
| Primary Text | Chalk White | #F5F5F5 | Main text, outlines |
|
||||||
|
| Accent 1 | Chalk Yellow | #FFE566 | Highlights, emphasis |
|
||||||
|
| Accent 2 | Chalk Pink | #FF9999 | Secondary highlights |
|
||||||
|
| Accent 3 | Chalk Blue | #66B3FF | Diagrams, links |
|
||||||
|
| Accent 4 | Chalk Green | #90EE90 | Success, nature |
|
||||||
|
| Accent 5 | Chalk Orange | #FFB366 | Warnings, energy |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Hand-drawn chalk illustrations with sketchy, imperfect lines
|
||||||
|
- Chalk dust effects around text and key elements
|
||||||
|
- Doodles: stars, arrows, underlines, circles, checkmarks
|
||||||
|
- Mathematical formulas and simple diagrams
|
||||||
|
- Eraser smudges and chalk residue textures
|
||||||
|
- Wooden frame border optional
|
||||||
|
- Stick figures and simple icons
|
||||||
|
- Connection lines with hand-drawn feel
|
||||||
|
|
||||||
|
## Style Rules
|
||||||
|
|
||||||
|
### Do
|
||||||
|
|
||||||
|
- Maintain authentic chalk texture on all elements
|
||||||
|
- Use imperfect, hand-drawn quality throughout
|
||||||
|
- Add subtle chalk dust and smudge effects
|
||||||
|
- Create visual hierarchy with color variety
|
||||||
|
- Include playful doodles and annotations
|
||||||
|
|
||||||
|
### Don't
|
||||||
|
|
||||||
|
- Use perfect geometric shapes
|
||||||
|
- Create clean digital-looking lines
|
||||||
|
- Add photorealistic elements
|
||||||
|
- Use gradients or glossy effects
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
Educational content, tutorials, classroom themes, teaching materials, workshops, informal learning sessions, knowledge sharing
|
||||||
|
|
@ -2,25 +2,60 @@
|
||||||
|
|
||||||
Black chalkboard background with colorful chalk drawing style
|
Black chalkboard background with colorful chalk drawing style
|
||||||
|
|
||||||
## Color Palette
|
## Design Aesthetic
|
||||||
|
|
||||||
- Primary: Chalk White (#F5F5F5), Chalk Yellow (#FFE566), Chalk Pink (#FF9999)
|
Classic classroom chalkboard aesthetic with hand-drawn chalk illustrations. Nostalgic educational feel with imperfect, sketchy lines that capture the warmth of traditional teaching. Colorful chalk creates visual hierarchy while maintaining the authentic chalkboard experience.
|
||||||
- Background: Chalkboard Black (#1A1A1A), Dark Green-Black (#1C2B1C)
|
|
||||||
- Accents: Chalk Blue (#66B3FF), Chalk Green (#90EE90), Chalk Orange (#FFB366)
|
|
||||||
|
|
||||||
## Visual Elements
|
## Background
|
||||||
|
|
||||||
- Chalkboard texture with subtle dust and smudges
|
- Color: Chalkboard Black (#1A1A1A) or Dark Green-Black (#1C2B1C)
|
||||||
- Hand-drawn chalk illustrations with sketchy lines
|
- Texture: Realistic chalkboard texture with subtle scratches, dust particles, and faint eraser marks
|
||||||
- Chalk dust effects around text and drawings
|
|
||||||
- Imperfect lines with visible texture
|
|
||||||
- Doodles, arrows, underlines, stars
|
|
||||||
- Eraser marks and chalk residue
|
|
||||||
|
|
||||||
## Typography
|
## Typography
|
||||||
|
|
||||||
- Hand-drawn chalk lettering, slightly uneven, with chalk texture
|
Hand-drawn chalk lettering style with visible chalk texture. Imperfect baseline adds authenticity. White or bright colored chalk for emphasis.
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Color | Hex | Usage |
|
||||||
|
|------|-------|-----|-------|
|
||||||
|
| Background | Chalkboard Black | #1A1A1A | Primary background |
|
||||||
|
| Alt Background | Green-Black | #1C2B1C | Traditional green board |
|
||||||
|
| Primary Text | Chalk White | #F5F5F5 | Main text, outlines |
|
||||||
|
| Accent 1 | Chalk Yellow | #FFE566 | Highlights, emphasis |
|
||||||
|
| Accent 2 | Chalk Pink | #FF9999 | Secondary highlights |
|
||||||
|
| Accent 3 | Chalk Blue | #66B3FF | Diagrams, links |
|
||||||
|
| Accent 4 | Chalk Green | #90EE90 | Success, nature |
|
||||||
|
| Accent 5 | Chalk Orange | #FFB366 | Warnings, energy |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Hand-drawn chalk illustrations with sketchy, imperfect lines
|
||||||
|
- Chalk dust effects around text and key elements
|
||||||
|
- Doodles: stars, arrows, underlines, circles, checkmarks
|
||||||
|
- Mathematical formulas and simple diagrams
|
||||||
|
- Eraser smudges and chalk residue textures
|
||||||
|
- Wooden frame border optional
|
||||||
|
- Stick figures and simple icons
|
||||||
|
- Connection lines with hand-drawn feel
|
||||||
|
|
||||||
|
## Style Rules
|
||||||
|
|
||||||
|
### Do
|
||||||
|
|
||||||
|
- Maintain authentic chalk texture on all elements
|
||||||
|
- Use imperfect, hand-drawn quality throughout
|
||||||
|
- Add subtle chalk dust and smudge effects
|
||||||
|
- Create visual hierarchy with color variety
|
||||||
|
- Include playful doodles and annotations
|
||||||
|
|
||||||
|
### Don't
|
||||||
|
|
||||||
|
- Use perfect geometric shapes
|
||||||
|
- Create clean digital-looking lines
|
||||||
|
- Add photorealistic elements
|
||||||
|
- Use gradients or glossy effects
|
||||||
|
|
||||||
## Best For
|
## Best For
|
||||||
|
|
||||||
Educational content, tutorials, classroom themes, back-to-school, teaching materials
|
Educational content, tutorials, classroom themes, teaching materials, workshops, informal learning sessions, knowledge sharing
|
||||||
|
|
|
||||||
|
|
@ -1,29 +1,61 @@
|
||||||
# chalkboard
|
# chalkboard
|
||||||
|
|
||||||
Colorful chalk drawings on dark board
|
Black chalkboard background with colorful chalk drawing style
|
||||||
|
|
||||||
## Color Palette
|
## Design Aesthetic
|
||||||
|
|
||||||
- Primary: Chalk colors - white, yellow, pink, blue, green
|
Classic classroom chalkboard aesthetic with hand-drawn chalk illustrations. Nostalgic educational feel with imperfect, sketchy lines that capture the warmth of traditional teaching. Colorful chalk creates visual hierarchy while maintaining the authentic chalkboard experience.
|
||||||
- Background: Dark green (#2D4A3E) or black chalkboard
|
|
||||||
- Accents: Bright chalk highlights, smudge effects
|
|
||||||
|
|
||||||
## Visual Elements
|
## Background
|
||||||
|
|
||||||
- Chalk texture on all elements
|
- Color: Chalkboard Black (#1A1A1A) or Dark Green-Black (#1C2B1C)
|
||||||
- Dusty, slightly smudged appearance
|
- Texture: Realistic chalkboard texture with subtle scratches, dust particles, and faint eraser marks
|
||||||
- Hand-drawn diagrams and doodles
|
|
||||||
- Eraser marks and imperfections
|
|
||||||
- Underlines and arrows
|
|
||||||
- Chalk dust particles
|
|
||||||
|
|
||||||
## Typography
|
## Typography
|
||||||
|
|
||||||
- Handwritten chalk lettering
|
Hand-drawn chalk lettering style with visible chalk texture. Imperfect baseline adds authenticity. White or bright colored chalk for emphasis.
|
||||||
- Varied chalk colors for emphasis
|
|
||||||
- Boxed and underlined headers
|
## Color Palette
|
||||||
- Casual, teacherly handwriting
|
|
||||||
|
| Role | Color | Hex | Usage |
|
||||||
|
|------|-------|-----|-------|
|
||||||
|
| Background | Chalkboard Black | #1A1A1A | Primary background |
|
||||||
|
| Alt Background | Green-Black | #1C2B1C | Traditional green board |
|
||||||
|
| Primary Text | Chalk White | #F5F5F5 | Main text, outlines |
|
||||||
|
| Accent 1 | Chalk Yellow | #FFE566 | Highlights, emphasis |
|
||||||
|
| Accent 2 | Chalk Pink | #FF9999 | Secondary highlights |
|
||||||
|
| Accent 3 | Chalk Blue | #66B3FF | Diagrams, links |
|
||||||
|
| Accent 4 | Chalk Green | #90EE90 | Success, nature |
|
||||||
|
| Accent 5 | Chalk Orange | #FFB366 | Warnings, energy |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Hand-drawn chalk illustrations with sketchy, imperfect lines
|
||||||
|
- Chalk dust effects around text and key elements
|
||||||
|
- Doodles: stars, arrows, underlines, circles, checkmarks
|
||||||
|
- Mathematical formulas and simple diagrams
|
||||||
|
- Eraser smudges and chalk residue textures
|
||||||
|
- Wooden frame border optional
|
||||||
|
- Stick figures and simple icons
|
||||||
|
- Connection lines with hand-drawn feel
|
||||||
|
|
||||||
|
## Style Rules
|
||||||
|
|
||||||
|
### Do
|
||||||
|
|
||||||
|
- Maintain authentic chalk texture on all elements
|
||||||
|
- Use imperfect, hand-drawn quality throughout
|
||||||
|
- Add subtle chalk dust and smudge effects
|
||||||
|
- Create visual hierarchy with color variety
|
||||||
|
- Include playful doodles and annotations
|
||||||
|
|
||||||
|
### Don't
|
||||||
|
|
||||||
|
- Use perfect geometric shapes
|
||||||
|
- Create clean digital-looking lines
|
||||||
|
- Add photorealistic elements
|
||||||
|
- Use gradients or glossy effects
|
||||||
|
|
||||||
## Best For
|
## Best For
|
||||||
|
|
||||||
Educational content, classroom explanations, tutorials, math and science concepts
|
Educational content, tutorials, classroom themes, teaching materials, workshops, informal learning sessions, knowledge sharing
|
||||||
|
|
|
||||||
|
|
@ -42,7 +42,7 @@ Break down complex content into eye-catching infographic series for Xiaohongshu
|
||||||
|
|
||||||
| Dimension | Controls | Options |
|
| Dimension | Controls | Options |
|
||||||
|-----------|----------|---------|
|
|-----------|----------|---------|
|
||||||
| **Style** | Visual aesthetics: colors, lines, decorations | cute, fresh, tech, warm, bold, minimal, retro, pop, notion |
|
| **Style** | Visual aesthetics: colors, lines, decorations | cute, fresh, warm, bold, minimal, retro, pop, notion, chalkboard |
|
||||||
| **Layout** | Information structure: density, arrangement | sparse, balanced, dense, list, comparison, flow |
|
| **Layout** | Information structure: density, arrangement | sparse, balanced, dense, list, comparison, flow |
|
||||||
|
|
||||||
Style × Layout can be freely combined. Example: `--style notion --layout dense` creates an intellectual-looking knowledge card with high information density.
|
Style × Layout can be freely combined. Example: `--style notion --layout dense` creates an intellectual-looking knowledge card with high information density.
|
||||||
|
|
@ -53,13 +53,13 @@ Style × Layout can be freely combined. Example: `--style notion --layout dense`
|
||||||
|-------|-------------|
|
|-------|-------------|
|
||||||
| `cute` (Default) | Sweet, adorable, girly - classic Xiaohongshu aesthetic |
|
| `cute` (Default) | Sweet, adorable, girly - classic Xiaohongshu aesthetic |
|
||||||
| `fresh` | Clean, refreshing, natural |
|
| `fresh` | Clean, refreshing, natural |
|
||||||
| `tech` | Modern, smart, digital |
|
|
||||||
| `warm` | Cozy, friendly, approachable |
|
| `warm` | Cozy, friendly, approachable |
|
||||||
| `bold` | High impact, attention-grabbing |
|
| `bold` | High impact, attention-grabbing |
|
||||||
| `minimal` | Ultra-clean, sophisticated |
|
| `minimal` | Ultra-clean, sophisticated |
|
||||||
| `retro` | Vintage, nostalgic, trendy |
|
| `retro` | Vintage, nostalgic, trendy |
|
||||||
| `pop` | Vibrant, energetic, eye-catching |
|
| `pop` | Vibrant, energetic, eye-catching |
|
||||||
| `notion` | Minimalist hand-drawn line art, intellectual |
|
| `notion` | Minimalist hand-drawn line art, intellectual |
|
||||||
|
| `chalkboard` | Colorful chalk on black board, educational |
|
||||||
|
|
||||||
Detailed style definitions: `references/styles/<style>.md`
|
Detailed style definitions: `references/styles/<style>.md`
|
||||||
|
|
||||||
|
|
@ -82,13 +82,13 @@ Detailed layout definitions: `references/layouts/<layout>.md`
|
||||||
|-----------------|-------|--------|
|
|-----------------|-------|--------|
|
||||||
| Beauty, fashion, cute, girl, pink | `cute` | sparse/balanced |
|
| Beauty, fashion, cute, girl, pink | `cute` | sparse/balanced |
|
||||||
| Health, nature, clean, fresh, organic | `fresh` | balanced/flow |
|
| Health, nature, clean, fresh, organic | `fresh` | balanced/flow |
|
||||||
| Tech, AI, code, digital, app, tool | `tech` | dense/list |
|
|
||||||
| Life, story, emotion, feeling, warm | `warm` | balanced |
|
| Life, story, emotion, feeling, warm | `warm` | balanced |
|
||||||
| Warning, important, must, critical | `bold` | list/comparison |
|
| Warning, important, must, critical | `bold` | list/comparison |
|
||||||
| Professional, business, elegant, simple | `minimal` | sparse/balanced |
|
| Professional, business, elegant, simple | `minimal` | sparse/balanced |
|
||||||
| Classic, vintage, old, traditional | `retro` | balanced |
|
| Classic, vintage, old, traditional | `retro` | balanced |
|
||||||
| Fun, exciting, wow, amazing | `pop` | sparse/list |
|
| Fun, exciting, wow, amazing | `pop` | sparse/list |
|
||||||
| Knowledge, concept, productivity, SaaS | `notion` | dense/list |
|
| Knowledge, concept, productivity, SaaS | `notion` | dense/list |
|
||||||
|
| Education, tutorial, learning, teaching, classroom | `chalkboard` | balanced/dense |
|
||||||
|
|
||||||
## File Structure
|
## File Structure
|
||||||
|
|
||||||
|
|
@ -285,13 +285,13 @@ Files:
|
||||||
|---|:---:|:---:|:---:|:---:|:---:|:---:|
|
|---|:---:|:---:|:---:|:---:|:---:|:---:|
|
||||||
| cute | ✓✓ | ✓✓ | ✓ | ✓✓ | ✓ | ✓ |
|
| cute | ✓✓ | ✓✓ | ✓ | ✓✓ | ✓ | ✓ |
|
||||||
| fresh | ✓✓ | ✓✓ | ✓ | ✓ | ✓ | ✓✓ |
|
| fresh | ✓✓ | ✓✓ | ✓ | ✓ | ✓ | ✓✓ |
|
||||||
| tech | ✓ | ✓✓ | ✓✓ | ✓✓ | ✓✓ | ✓✓ |
|
|
||||||
| warm | ✓✓ | ✓✓ | ✓ | ✓ | ✓✓ | ✓ |
|
| warm | ✓✓ | ✓✓ | ✓ | ✓ | ✓✓ | ✓ |
|
||||||
| bold | ✓✓ | ✓ | ✓ | ✓✓ | ✓✓ | ✓ |
|
| bold | ✓✓ | ✓ | ✓ | ✓✓ | ✓✓ | ✓ |
|
||||||
| minimal | ✓✓ | ✓✓ | ✓✓ | ✓ | ✓ | ✓ |
|
| minimal | ✓✓ | ✓✓ | ✓✓ | ✓ | ✓ | ✓ |
|
||||||
| retro | ✓✓ | ✓✓ | ✓ | ✓✓ | ✓ | ✓ |
|
| retro | ✓✓ | ✓✓ | ✓ | ✓✓ | ✓ | ✓ |
|
||||||
| pop | ✓✓ | ✓✓ | ✓ | ✓✓ | ✓✓ | ✓ |
|
| pop | ✓✓ | ✓✓ | ✓ | ✓✓ | ✓✓ | ✓ |
|
||||||
| notion | ✓✓ | ✓✓ | ✓✓ | ✓✓ | ✓✓ | ✓✓ |
|
| notion | ✓✓ | ✓✓ | ✓✓ | ✓✓ | ✓✓ | ✓✓ |
|
||||||
|
| chalkboard | ✓✓ | ✓✓ | ✓✓ | ✓✓ | ✓ | ✓✓ |
|
||||||
|
|
||||||
## References
|
## References
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,61 @@
|
||||||
|
# chalkboard
|
||||||
|
|
||||||
|
Black chalkboard background with colorful chalk drawing style
|
||||||
|
|
||||||
|
## Design Aesthetic
|
||||||
|
|
||||||
|
Classic classroom chalkboard aesthetic with hand-drawn chalk illustrations. Nostalgic educational feel with imperfect, sketchy lines that capture the warmth of traditional teaching. Colorful chalk creates visual hierarchy while maintaining the authentic chalkboard experience.
|
||||||
|
|
||||||
|
## Background
|
||||||
|
|
||||||
|
- Color: Chalkboard Black (#1A1A1A) or Dark Green-Black (#1C2B1C)
|
||||||
|
- Texture: Realistic chalkboard texture with subtle scratches, dust particles, and faint eraser marks
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
Hand-drawn chalk lettering style with visible chalk texture. Imperfect baseline adds authenticity. White or bright colored chalk for emphasis.
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Color | Hex | Usage |
|
||||||
|
|------|-------|-----|-------|
|
||||||
|
| Background | Chalkboard Black | #1A1A1A | Primary background |
|
||||||
|
| Alt Background | Green-Black | #1C2B1C | Traditional green board |
|
||||||
|
| Primary Text | Chalk White | #F5F5F5 | Main text, outlines |
|
||||||
|
| Accent 1 | Chalk Yellow | #FFE566 | Highlights, emphasis |
|
||||||
|
| Accent 2 | Chalk Pink | #FF9999 | Secondary highlights |
|
||||||
|
| Accent 3 | Chalk Blue | #66B3FF | Diagrams, links |
|
||||||
|
| Accent 4 | Chalk Green | #90EE90 | Success, nature |
|
||||||
|
| Accent 5 | Chalk Orange | #FFB366 | Warnings, energy |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Hand-drawn chalk illustrations with sketchy, imperfect lines
|
||||||
|
- Chalk dust effects around text and key elements
|
||||||
|
- Doodles: stars, arrows, underlines, circles, checkmarks
|
||||||
|
- Mathematical formulas and simple diagrams
|
||||||
|
- Eraser smudges and chalk residue textures
|
||||||
|
- Wooden frame border optional
|
||||||
|
- Stick figures and simple icons
|
||||||
|
- Connection lines with hand-drawn feel
|
||||||
|
|
||||||
|
## Style Rules
|
||||||
|
|
||||||
|
### Do
|
||||||
|
|
||||||
|
- Maintain authentic chalk texture on all elements
|
||||||
|
- Use imperfect, hand-drawn quality throughout
|
||||||
|
- Add subtle chalk dust and smudge effects
|
||||||
|
- Create visual hierarchy with color variety
|
||||||
|
- Include playful doodles and annotations
|
||||||
|
|
||||||
|
### Don't
|
||||||
|
|
||||||
|
- Use perfect geometric shapes
|
||||||
|
- Create clean digital-looking lines
|
||||||
|
- Add photorealistic elements
|
||||||
|
- Use gradients or glossy effects
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
Educational content, tutorials, classroom themes, teaching materials, workshops, informal learning sessions, knowledge sharing
|
||||||
|
|
@ -1,23 +0,0 @@
|
||||||
# tech
|
|
||||||
|
|
||||||
Modern, smart, digital
|
|
||||||
|
|
||||||
## Color Palette
|
|
||||||
|
|
||||||
- Primary: Deep blue (#1A365D), purple (#6B46C1), cyan (#00D4FF)
|
|
||||||
- Background: Dark gray (#1A202C), near-black (#0D1117)
|
|
||||||
- Accents: Neon green (#00FF88), electric blue
|
|
||||||
|
|
||||||
## Visual Elements
|
|
||||||
|
|
||||||
- Circuit patterns, data icons
|
|
||||||
- Geometric grids, glowing effects
|
|
||||||
- Tech-inspired decorations
|
|
||||||
|
|
||||||
## Typography
|
|
||||||
|
|
||||||
- Monospace-style hand lettering, subtle glow
|
|
||||||
|
|
||||||
## Best For
|
|
||||||
|
|
||||||
Tech tutorials, AI content, digital tools, productivity
|
|
||||||