slidev-theme-easy

slidev-theme-easy

A simple theme for Slidev. The main feature is the support for configuring theme colors with transparency.

Install

Add the following frontmatter to your slides.md. Start Slidev then it will prompt you to install the theme automatically.

---
theme: easy
---

Theme color variables must provide both HEX and RGB formats to support background color transparency.

---
themeConfig:
  primary: #ff0000
  primary-rgb: '255,0,0'
---

Learn more about how to use a theme.

Layouts

This theme provides the following layouts:

Cover

Usage:

layout: cover
background: 'https://source.unsplash.com/collection/94734566/1920x1080'

Intro

Usage:

layout: intro
image: 'https://source.unsplash.com/collection/94734566/1920x1080'
class: opacity-75
# use `left: false` to toggle the color block to the right
left: true

Image-Left

Usage:

layout: image-left

# the image source
image: ./path/to/the/image

# a custom class name to the content
class: my-cool-content-on-the-right

# equal or one third
equal: false

# show frame
imageFrame: false

layout: image-left
equal: true
imageFrame: true

Image-Right

Usage:

layout: image-right

# the image source
image: ./path/to/the/image

# a custom class name to the content
class: my-cool-content-on-the-left

# equal or one third
equal: true

# show frame
imageFrame: false

Image-Bottom

Usage:

layout: image-bottom

# the image source, can be empty (show bg color)
image: ./path/to/the/image

# a custom class name to the content
class: my-cool-content

# image height, one-sixth or one-third
thin: true

Contributing

• pnpm install
• pnpm dev to start theme preview of example.md
• Edit the example.md and style to see the changes
• pnpm export to generate the preview PDF
• pnpm screenshot to generate the preview PNG