# Obsidian-Typora-Vue-Theme

**Repository Path**: zekunc/Obsidian-Typora-Vue-Theme

## Basic Information

- **Project Name**: Obsidian-Typora-Vue-Theme
- **Description**: A light theme for Obsidian(https://obsidian.md/).
- **Primary Language**: CSS
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 8
- **Forks**: 1
- **Created**: 2021-07-27
- **Last Updated**: 2024-10-30

## Categories & Tags

**Categories**: Uncategorized

**Tags**: Typora, Vue, obsidian, obsidian-theme

## README

![obsidian-typora-vue-high-res](./obsidian-typora-vue-high-res.png)

[![theme](https://img.shields.io/badge/theme-Obsidian-blueviolet.svg?color=blueviolet)](https://obsidian.md/) [![GitHub issues](https://img.shields.io/github/issues/ZekunC/Obsidian-Typora-Vue-Theme.svg?color=orange)](https://github.com/ZekunC/Obsidian-Typora-Vue-Theme/issues) [![GitHub issues](https://img.shields.io/github/issues-closed/ZekunC/Obsidian-Typora-Vue-Theme.svg?color=green)](https://github.com/ZekunC/Obsidian-Typora-Vue-Theme/issues?q=is%3Aissue+is%3Aclosed) [![GitHub release](https://img.shields.io/github/release/ZekunC/Obsidian-Typora-Vue-Theme.svg?color=brightgreen)](https://github.com/ZekunC/Obsidian-Typora-Vue-Theme/releases) [![GitHub stars](https://img.shields.io/github/stars/ZekunC/Obsidian-Typora-Vue-Theme.svg)](https://github.com/ZekunC/Obsidian-Typora-Vue-Theme/stargazers) 

## Notice

🎈Dark mode is supported.

🎉Theme can be downloaded from Obsidian community theme store now!

✨Theme has been updated to version **v1.0.4**!

## About

[Obsidian-Typora-Vue-Theme](https://github.com/ZekunC/Obsidian-Typora-Vue-Theme) (**v1.0.4**) is a theme for [Obsidian](https://obsidian.md/), which is inspired by [typora-vue-theme](https://github.com/blinkfox/typora-vue-theme) and [Blue Topaz](https://github.com/whyt-byte/Blue-Topaz_Obsidian-css/).

The file style is choosed  to be as similar with [typora-vue-theme](https://github.com/blinkfox/typora-vue-theme) as possible so that you can use these two kinds of software simultaneously and switch in a low-cost way. 

## Screenshot

- Light Mode

![screenshot](high-res.png)

- Dark Mode

![dark](high-res-dark.png)

## Feature

### 1. Eye Protection Color Snippet

You may think that the pure white background color in light mode is too bright to read, so I give an [./other/eye-protection-color.css](./other/eye-protection-color.css) snippet with modified gray color. You can use it after installing this theme in **light mode**.

![](./README.assets/gray-color.png)

### 2. Less is More

Only modify the most necessary styles, such as color, blockquote, header font and so on. You can get the colors in [Color-picker](#Color-picker). 

### 3. Hover on Header

Available in both editing view and reading view.

![](README.assets/img13.gif)

### 4. Highlight the Cursor Line

Highlight the current cursor line in editing view.

![](./README.assets/img14.gif)

### 5. Easily Change the Accent Color

If you also try other theme color but still remain the rest style, you *ONLY* need to set the Accent Color as what you like from `Obsidian -> Settings -> Appearance -> Accent Color`.

Some accent colors I recommend :

`#e95f59` from [Drake-light in Typora](https://github.com/liangjingkanji/DrakeTyporaTheme)

![](./README.assets/drake-light.png)

`#3884ff` from [Gitbook-Azure in Typora](https://github.com/h16nning/typora-gitbook-theme)

![](./README.assets/gitbook-azure.png)

## Color-picker

```txt
accent color: #42b883
normal text: #34495e
block quote: hsla(accent color, 0.1)
inline code text: #e96900
inline/block code background: #f8f8f8
table header: #f2f2f2
table gap tr: #fafafa
highlight cursor line: rgba(245,204,142,0.12)
```

## History Version & Change Log

Please see [version-history.md](./version-history.md).

## Install

### Community Theme Store (Recommended)

Search `Typora-Vue` in Obsidian community theme store and download it.

### Manually

Manually download the `Typora-Vue.zip` from [Releases](https://github.com/ZekunC/Obsidian-Typora-Vue-Theme/releases) to your local `\.obsidian\themes\` and unzip it.

## Contributing

Issues and PRs are welcome.