---
tags: theme
title: HackMD Dark Theme - ZeWaka Edition
description: Use `{%hackmd @ZeWaka/dark-theme %}` syntax to include this theme.
---

<style>

html, body, .ui-content {
background-color: #282C34;
color: #ddd;
}

/* For dark book sidebar */

div.summary .toolbar {
background-color: #282C34;
}

div.summary {
background-color: #282C34;
}

div.summary .nav>li>a {
color: #ABB2BF;
}

div.summary input {
color: #ABB2BF !important;
background-color: #282C34;
}

/* For dark and one-dark styled code blocks */

code {
background-color: #1e2328 !important;
}

pre.part {
background-color: #1e2328 !important;
}

pre.part code {
color: #ABB2BF !important;
}

pre code {
background-color: #1e2328 !important;
color: #ABB2BF !important;
}

div.code {
color: #ABB2BF !important;
}

span.keyword {
color: #c678DD !important;
}

span.token {
color: #c678DD !important;
}

span.operator {
color: #ABB2BF !important;
background-color: #1e2328 !important;
}

span.constant {
color: #E06C75 !important;
}

span.function {
color: #61AFEF !important;
}

span.punctuation {
color: #E5C07B !important;
}

/* Darkmode styling for the rest and misc. elements */

.ui-view-area > .ui-infobar {
display: block;
}

.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4,
.markdown-body h5,
.markdown-body h6 {
color: #ddd;
}

.markdown-body h1,
.markdown-body h2 {
border-bottom-color: #ffffff69;
}

.markdown-body h1 .octicon-link,
.markdown-body h2 .octicon-link,
.markdown-body h3 .octicon-link,
.markdown-body h4 .octicon-link,
.markdown-body h5 .octicon-link,
.markdown-body h6 .octicon-link {
color: #fff;
}

.markdown-body img {
background-color: transparent;
}

.ui-toc-dropdown .nav>.active:focus>a, .ui-toc-dropdown .nav>.active:hover>a, .ui-toc-dropdown .nav>.active>a {
color: white;
border-left: 2px solid white;
}

.expand-toggle:hover,
.expand-toggle:focus,
.back-to-top:hover,
.back-to-top:focus,
.go-to-bottom:hover,
.go-to-bottom:focus {
color: white;
}

.ui-toc-dropdown {
background-color: #282C34;
}

.ui-toc-label.btn {
background-color: #191919;
color: white;
}

.ui-toc-dropdown .nav>li>a:focus,
.ui-toc-dropdown .nav>li>a:hover {
color: white;
border-left: 1px solid white;
}

.markdown-body blockquote {
color: #bcbcbc;
}

.markdown-body table tr {
background-color: #5f5f5f;
}

.markdown-body table tr:nth-child(2n) {
background-color: #4f4f4f;
}

.markdown-body code,
.markdown-body tt {
color: #eee;
background-color: rgba(230, 230, 230, 0.36);
}

a,
.open-files-container li.selected a {
color: #5EB7E0;
}
</style>
# 網路資源
原本是之前大學時期整理的。
看到有大禮包的[噗](https://www.plurk.com/p/ofnz6q)，就把自己可能用到的順便整理一下補上來。
舊的沒有檢查還能不能用。

## PPT template

有一些設計得很好的圖表，很方便修改

- presentationgo
http://www.presentationgo.com/

- Info graph!c
http://infographic.jp/gallery/
- ALL PPT
http://www.free-powerpoint-templates-design.com/free-powerpoint-charts-design/

- the pop (範本都非常漂亮，但有很多動畫設計，用的時候要小心)
http://thepopp.com/template/

- 線上設計網站Canva
https://www.canva.com/

- slide carnival
http://www.slidescarnival.com/

- PPT BIZCAM
http://pptbizcam.co.kr/
韓國的資源(但因為說明和使用限制都看不懂，所以不太知道使用的界線，沒有在用)

## 簡報製作教學

- 簡報練功團
https://www.facebook.com/pptpresentation/?ref=ts&fref=ts

- papaya (各種教學都蠻實用的)
https://www.youtube.com/c/papayaclass/featured

## 拯救選色障礙

- adobe color cc
https://color.adobe.com/zh/create/color-wheel/

- coolors
https://coolors.co/

- colorion (有點像coolors，但使用人數好像比較少)
https://material.colorion.co/popular

- color supply
http://colorsupplyyy.com/app/

- Paletton(感覺是這系列裡面，難度最高的)
https://paletton.com/#uid=1000u0kllllaFw0g0qFqFg0w0aF

## 單色色票

- NIPPON COLORS (網頁很潮，提供色碼CMYK、RGB)
http://nipponcolors.com/

- 中國傳統色 (學日本那個網頁的)
http://zhongguose.com/

- 中國傳統顏色名錄
https://www.facebook.com/mychistory/photos/a.356982424488062.1073741828.356931764493128/551726641680305/?type=3&theater

## icon

我個人最推flaticon，不過最近有些要求要付費才能下載。可以線上選很多個別icon、調色後一起下載，非常方便。

- flaticon
http://www.flaticon.com/

另外一個是iconfinder，但這個就有點良莠不齊。

- iconfinder
https://www.iconfinder.com/

再來是有個很有事、我一直很想用，但一直找不到機會用的icon系列。

- pictogram
http://pictogram2.com/
http://icooon-mono.com/

- ハンコでアソブ
http://hankodeasobu.com/

- いらすとや
https://www.irasutoya.com/

- 8suke
https://www.8suke.net/

- girlysozai
http://girlysozai.com/

- StickPNG
https://www.stickpng.com/cat

- story set
https://storyset.com/

## 邊線
- free-line-design
http://free-line-design.com/

## 手繪背景
- アキ二号機(pixiv)
https://www.pixiv.net/users/61071305/illustrations/%E7%84%A1%E6%96%99%E8%83%8C%E6%99%AF

## 紙紋
- paper-co
https://free-paper-texture.com/?fbclid=IwAR38U4Fpkd-cSKbzaVLzbknvCpLgVl_j2iBjoBpCQW0lWKeLWXU06NsLsSQ

# 免費資源編輯軟體

## 點陣圖

- GIMP
https://www.gimp.org/

## 向量圖
- Inkscape (但做向量圖的群眾還太少，這個其實沒有很好用)
https://inkscape.org/en/

## 影片
- openshot
http://www.openshot.org/

- SRT subtitle Toolkit 貼字幕
https://srt.coderemixer.com/

## 線上編輯
- Photopea
https://www.plurk.com/dayofdays

- Figma
https://www.figma.com/

- Polarr
https://photoeditor.polarr.co/

- 去背
https://www.remove.bg/zh/upload

# 高品質照片免費CC創用

- librestock
可以一次搜尋47個CC圖庫，可以直接打關鍵字很方便。
http://librestock.com/

- 日本的CC圖庫，有些很有事的照片
https://www.pakutaso.com/

- visual hunt
https://visualhunt.com/

# 綜合資源

如果有稍微高一點的技術力處理素材，我推薦freepik，裏頭大部分品質都還不錯，而且重複率不高。
- freepik
http://www.freepik.com/

- 無料イラスト素材
https://www.xn--eckzb3bzhw32znfcp1zduw.com/

# 字體
日本風中文字型

- Font Free
http://fontfree.me/

- Free Japanese Fonts
http://www.freejapanesefont.com/

- Dafont (英文字體)
https://www.dafont.com/theme.php?cat=401

- 巴哈有人整理的中文開源字體列表(瀨戶真的超可愛)
https://forum.gamer.com.tw/C.php?bsn=60076&snA=3906436

# 其他
- code beautify
https://codebeautify.org/