themer

themer

themer采用一组颜色，并生成编辑器主题，终端主题，其他应用程序的主题以及桌面壁纸。

目录

• 入门
• CLI文档
  • 安装
  • 用法
  • 示例工作流程：DotFiles集成
  • 示例工作流程：NPX
  • 示例工作流程：使用base16方案与themer
• API文档
  • 安装
  • 界面
  • 创建自定义颜色集
    • 颜色映射
  • 创建自定义模板
• themer颜色集
  • 仅网络颜色集
  • 原始颜色集
  • 第三方主题的港口
• themer模板
  • 终端
  • 编辑/IDE
  • 其他应用程序
  • 壁纸
• 先前的艺术
• 贡献

入门

有几种不同的方法可以通过themer来提高您的开发设置：

1. 基于Web的图形用户界面。 themer在themer .dev上设有一个官方的渐进式网络应用程序。
2. 命令行接口。 themer可以用于在CLI上生成主题，请参见下面的CLI文档。
3. 应用程序编程接口。 themer揭示了用于程序使用的JavaScript API（带有打字稿类型定义）；请参阅下面的API文档。

功能比较：

CLI文档

从V5开始， themer将作为单个打字条/JavaScript软件包分布，其中包含所有内置颜色集和模板，以易于使用，但仍然支持使用自定义颜色集或模板的使用。

安装

使用您的JavaScript软件包管理器从NPM安装themer 。

npm install themer

themer也可以在全球安装。或者，如果您不想安装它，则可以与NPX一起使用。

用法

 themer [options]

将themer一个或多个颜色集通过您希望的多个模板，随意的壁纸分辨率和输出目录。

– 颜色， – 模板和 – 尺寸可以多次指定。

您生成的主题文件以及有关如何安装它们的读书文件将写入输出目录。

示例工作流程：DotFiles集成

假设您想使用themer的默认颜色集生成VIM主题和桌面背景。首先，安装themer ：

 cd my-dotfiles
npm install themer

然后编辑您的软件包。JSON：

themer -c default -t vim -t vim-lightline -t hyper -t wallpaper-block-wave -o gen"
}
}\”>

{
  \"scripts\" : {
    \"build\" : \" themer -c default -t vim -t vim-lightline -t hyper -t wallpaper-block-wave -o gen \"
  }
}

然后运行您的新脚本：

npm run build

现在，检查生成的文件的Gen/文件夹。这是结果：

示例工作流程：NPX

此命令将使用themer的默认颜色集生成VIM主题和Block Wave壁纸，并将它们放入一个称为输出的文件夹中：

npx themer -c default -t vim -t wallpaper-block-wave -o output

示例工作流程：使用base16方案与themer

代替themer颜色集，您还可以为themer提供任何Base16方案yaml文件。

 themer --color-set path/to/base16-scheme.yml ...

有关基本16方案列表，请参阅base16存储库。

API文档

themer器具有JavaScript API（带打字稿类型定义），用于编程生成主题。

安装

npm install themer

界面

themer的默认导出是一个异步生成器函数，该函数采用三个参数：

1. 一系列颜色集对象或主题内置themer集的字符串标识符
2. 一系列模板对象或主题内置themer的字符串标识符
3. 用于指定输出壁纸图像分辨率的渲染对象
4. （可选）输出FileTransform async Generator函数，该函数会转换提供的模板生成的文件。此功能在每个模板的渲染和渲染Instructions功能之间运行。

发电机产生的对象是输出文件或输出filetransform产生的类型。

themer ";
import myColors from "./my-colors";
import myTemplate from "./my-template";

// Example usage: generate Vim themes, 1440×900 wallpapers, and custom files
// from themer \’s "Night Sky" color set and a custom color set.
const files = themer (
["night-sky", myColors],
["vim", "wallpaper-block-wave", myTemplate],
{ wallpaperSizes: [{ width: 1440, height: 900 }] }
);

for await (const file of files) {
// …
}\”>

 import themer from \" themer \" ;
import myColors from \"./my-colors\" ;
import myTemplate from \"./my-template\" ;

// Example usage: generate Vim themes, 1440x900 wallpapers, and custom files
// from themer \'s \"Night Sky\" color set and a custom color set.
const files = themer (
  [ \"night-sky\" , myColors ] ,
  [ \"vim\" , \"wallpaper-block-wave\" , myTemplate ] ,
  { wallpaperSizes : [ { width : 1440 , height : 900 } ] }
) ;

for await ( const file of files ) {
  // ...
}

创建自定义颜色集

themer";

const myColorSet: ColorSet = {
// Color sets should provide a human-readable name.
name: "My Color Set",

// Color sets can define a dark variant, a light variant, or both.
// Each variant provides two or eight shades and eight accent colors in hex format.
variants: {
// In a dark variant, shade0 should be the darkest and shade7 should be
// the lightest.
dark: {
shade0: "#333333",
// Note: you can define shades 1 through 6 yourself, or you can omit
// them; if omitted, they will be calculated automatically by
// interpolating between shade0 and shade7.
shade7: "#eeeeee",
accent0: "#ff4050",
accent1: "#f28144",
accent2: "#ffd24a",
accent3: "#a4cc35",
accent4: "#26c99e",
accent5: "#66bfff",
accent6: "#cc78fa",
accent7: "#f553bf",
},

// In a light variant, shade7 should be the darkest and shade0 should be
// the lightest.
light: {
shade0: "#eeeeee",
shade7: "#333333",
accent0: "#f03e4d",
accent1: "#f37735",
accent2: "#eeba21",
accent3: "#97bd2d",
accent4: "#1fc598",
accent5: "#53a6e1",
accent6: "#bf65f0",
accent7: "#ee4eb8",
},
},
};

export default myColorSet;\”>

 import type { ColorSet } from \" themer \" ;

const myColorSet : ColorSet = {
  // Color sets should provide a human-readable name.
  name : \"My Color Set\" ,

  // Color sets can define a dark variant, a light variant, or both.
  // Each variant provides two or eight shades and eight accent colors in hex format.
  variants : {
    // In a dark variant, shade0 should be the darkest and shade7 should be
    // the lightest.
    dark : {
      shade0 : \"#333333\" ,
      // Note: you can define shades 1 through 6 yourself, or you can omit
      // them; if omitted, they will be calculated automatically by
      // interpolating between shade0 and shade7.
      shade7 : \"#eeeeee\" ,
      accent0 : \"#ff4050\" ,
      accent1 : \"#f28144\" ,
      accent2 : \"#ffd24a\" ,
      accent3 : \"#a4cc35\" ,
      accent4 : \"#26c99e\" ,
      accent5 : \"#66bfff\" ,
      accent6 : \"#cc78fa\" ,
      accent7 : \"#f553bf\" ,
    } ,

    // In a light variant, shade7 should be the darkest and shade0 should be
    // the lightest.
    light : {
      shade0 : \"#eeeeee\" ,
      shade7 : \"#333333\" ,
      accent0 : \"#f03e4d\" ,
      accent1 : \"#f37735\" ,
      accent2 : \"#eeba21\" ,
      accent3 : \"#97bd2d\" ,
      accent4 : \"#1fc598\" ,
      accent5 : \"#53a6e1\" ,
      accent6 : \"#bf65f0\" ,
      accent7 : \"#ee4eb8\" ,
    } ,
  } ,
} ;

export default myColorSet ;

专家提示：您可以使用themer的Web UI更轻松地选择颜色，然后单击“下载”按钮以正确格式生成颜色。使用Web UI，您还可以输入任何有效的CSS颜色格式（关键字，HSL，RGB等），并且它将自动为您转换颜色。

颜色映射

为了帮助您选择自己的颜色套装的颜色，这大约是大多数themer模板如何利用您的颜色的方式：

*建议与终端主题中的ANSI颜色名称保持一致，但并不是一个很难的要求。

有关颜色映射的更多视觉表示，请参见themer的Web UI。

创建自定义模板

themer";

const template: Template = {
// Templates should provide a human-readable name.
name: "My Template",

// The render async generator function takes a color set and the render
// options, and yields one or more output files. The color set is fully
// expanded (e.g., if the color set did not include shades 1 through 6
// when originally authored, those intermediary shades will have already
// been calculated and included).
render: async function* (colorSet, options) {
// The yielded output file has two properties: a string path (relative)
// and a Buffer of the file\’s content.
yield {
path: "my-file.txt",
content: Buffer.from("Hello, world!", "utf8"),
};
},

// The renderInstructions function takes an array of paths generated from
// the render function and should return a Markdown string, which will be
// included in the generated README.md file.
renderInstructions: (paths) =>
`Copy the files (${paths.join(" and ")}) to your home directory.`,
};

export default template;\”>

 import type { Template } from \" themer \" ;

const template : Template = {
  // Templates should provide a human-readable name.
  name : \"My Template\" ,

  // The render async generator function takes a color set and the render
  // options, and yields one or more output files. The color set is fully
  // expanded (e.g., if the color set did not include shades 1 through 6
  // when originally authored, those intermediary shades will have already
  // been calculated and included).
  render : async function * ( colorSet , options ) {
    // The yielded output file has two properties: a string path (relative)
    // and a Buffer of the file\'s content.
    yield {
      path : \"my-file.txt\" ,
      content : Buffer . from ( \"Hello, world!\" , \"utf8\" ) ,
    } ;
  } ,

  // The renderInstructions function takes an array of paths generated from
  // the render function and should return a Markdown string, which will be
  // included in the generated README.md file.
  renderInstructions : ( paths ) =>
    `Copy the files ( ${ paths . join ( \" and \" ) } ) to your home directory.` ,
} ;

export default template ; 

themer颜色集

仅网络颜色集

（仅在themer .dev上可用。）

原始颜色集

第三方主题的港口

themer模板

终端

• Alacritty
• CMD
• 孔库
• 超级
• iterm
• 猫咪
• Konsole
• 终端
• 终结者
• 经
• Windows末端

编辑/IDE

• bedit
• emacs
• 崇高文本
• vim-lightline
• vim
• 视觉工作
• VS-CODE
• XCode

其他应用程序

• 阿尔弗雷德
• 勇敢的
• 铬合金
• CSS
• Firefox-Addon
• Firefox-Color
• kde-plasma色
• Keypirinha
• 棱镜
• 素描件
• 松弛
• WOX
• xresources

壁纸

有关壁纸预览，请参见themer的Web UI。

• 3D（仅网络）
  • 壁纸证明
  • 墙纸 – 洛戈斯
• 2D（Web＆CLI）
  • 壁纸块波
  • 壁纸爆炸
  • 壁纸圈
  • 墙纸钻石
  • 壁纸点网格
  • 墙纸 – 八角形
  • 墙纸衬衫
  • 墙纸 – 三角形
  • 壁纸-trianglify

先前的艺术

themer受到Chriskempson/Base16和类似项目的启发。

从概念上讲， themer与base16非常相似，但是：

1. 它更轻，更易于使用。
2. 使用自己的颜色组和模板更容易扩展。
3. 它可以更好地与您的DotFiles集成，尤其是如果您将它们保持在版本控制之下。

贡献

有关如何为themer做出贡献的说明，请参见贡献。MD和themer的行为准则。