slidev-theme-neversink

Create and present web-based slides for developers using Markdown, Vue components, code highlighting, animations, and interactive features with the Neversink theme. Use for technical presentations, academic talks, conference presentations, or educational materials when users mention Slidev, Neversink theme, web presentations, or creating slides with code examples and animations.

Safety Notice

This listing is imported from skills.sh public index metadata. Review upstream SKILL.md and repository scripts before running.

Copy this and send it to your AI assistant to learn

Install skill "slidev-theme-neversink" with this command: npx skills add hsiangjenli/skills/hsiangjenli-skills-slidev-theme-neversink

Slidev Theme Neversink

Create educational and academic presentations using the Neversink theme - a bright, flat, minimal Slidev theme with advanced layouts, color schemes, and interactive components.

Quick Start

Basic Neversink presentation setup:

---
theme: neversink
colorSchema: auto
title: Your Presentation Title
---

# Your Title Slide

Your subtitle or author information

---
layout: default
---

# Content Slide

Your content here with **bold**, *italic*, and ==highlighted== text.

Core Capabilities

1. Layout System

Choose from 15+ specialized layouts for different content types:

  • cover - Title slides with optional notes
  • side-title - Side-positioned titles with content areas
  • two-cols-title - Header with two-column layout
  • top-title-two-cols - Top title with two-column content
  • image-left/right - Image with content positioning
  • section - Section dividers with emphasis
  • quote - Styled quotations with attribution
  • credits - Movie-style scrolling credits
  • full - Custom layouts with complete control

For complete layout reference, see layouts.md.

2. Color Schemes

Monochromatic color pairs for visual coherence:

  • Neutrals: black, white, dark, light, gray
  • Colors: Available in regular and -light variants
  • Examples: sky, amber, emerald, pink, navy

Apply colors in frontmatter: color: sky-light

3. Interactive Components

  • StickyNote: Draggable sticky notes with color schemes
  • SpeechBubble: Animated speech bubbles with positioning
  • Admonition: Callout boxes for notes, warnings, tips
  • IceCream: Kawaii mascot character
  • v-drag: Make any element draggable for custom layouts

For component examples, see components.md.

4. Code & Animation Features

  • Syntax highlighting with code focus
  • Step-by-step code reveals
  • Animated transitions between slides
  • Live web content with iframe layouts

Workflow Decision Tree

New Presentation → Use presentation templates in assets/templates/ → Academic: academic-template.md → Technical: technical-template.md → Business: business-template.md

Existing Slidev Presentation → Add theme: neversink to frontmatter → Convert layouts using guidance in layouts.md

Specific FeaturesCode demonstrations: Use technical template with code highlighting → Interactive elements: Add components from components.mdColor theming: Apply schemes from colors.mdAdvanced layouts: Use full layout with custom positioning

Common Examples

Academic Presentation

# Setup new presentation
npm install slidev-theme-neversink
# Use academic template from assets/templates/

Technical Code Demo

---
layout: two-cols-title
color: navy
---

:: title ::
# API Integration Example

:: left ::
```python
# Code example with syntax highlighting
def fetch_data(url):
    response = requests.get(url)
    return response.json()

:: right :: <StickyNote color="amber-light"> Remember to handle errors! </StickyNote>


**Interactive Presentation**
```md
---
layout: full
---

<SpeechBubble position="l" color="sky" animation="float">
Your explanation here
</SpeechBubble>

<div v-drag="[100,200,300,150]">
Draggable content
</div>

Resources

scripts/

Ready-to-use utilities for Neversink presentations:

  • setup_presentation.py - Initialize new Neversink presentation with theme setup
  • convert_layouts.py - Convert existing Slidev layouts to Neversink equivalents
  • validate_colors.py - Check color scheme consistency across slides

references/

Detailed documentation loaded as needed:

  • layouts.md - Complete layout reference with examples and frontmatter options
  • colors.md - Color scheme guide with visual examples and use cases
  • components.md - Interactive component library with code examples
  • animations.md - Animation and transition patterns
  • frontmatter.md - Configuration options and settings reference

assets/

Ready-to-use templates and examples:

  • templates/academic-template.md - Academic presentation starter
  • templates/technical-template.md - Technical demo starter
  • templates/business-template.md - Business presentation starter
  • examples/ - Sample slides demonstrating each layout type
  • components/ - Copy-paste component examples

Installation

Ensure Slidev is installed, then add the theme:

npm install slidev-theme-neversink

Add to your slides.md frontmatter:

---
theme: neversink
---

Advanced Usage

For complex presentations requiring custom layouts, animations, or extensive interactivity, consult the reference files for detailed implementation patterns and best practices.

Source Transparency

This detail page is rendered from real SKILL.md content. Trust labels are metadata-based hints, not a safety guarantee.

Related Skills

Related by shared tags or category signals.

Coding

code-styleguide

No summary provided by upstream source.

Repository SourceNeeds Review
Coding

python

No summary provided by upstream source.

Repository SourceNeeds Review
General

tech-slide

No summary provided by upstream source.

Repository SourceNeeds Review
General

skill-creator

No summary provided by upstream source.

Repository SourceNeeds Review