@@ 1,8 1,17 @@
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="generator" content="xidoc"><meta name="viewport" content="width=device-width,initial-scale=1"><!--
© 2023 Adam Blažek <blazead5@cvut.cz>
SPDX-License-Identifier: GPL-3.0-or-later
---><title>Vier</title><link rel="stylesheet" href="xi.css" /><style>:root{--fg-accent:#4ea;}
-:root{--bg-accent:#275;}code[class*=language-],pre[class*=language-]{font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:.4em .8em;margin:.5em 0;overflow:auto;background-color:#000}code[class*=language-]{background:#000;color:#fff;box-shadow:-.3em 0 0 .3em #000,.3em 0 0 .3em #000}:not(pre)>code[class*=language-]{padding:.2em;border-radius:.3em;box-shadow:none;white-space:normal}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#aaa}.token.punctuation{color:#999}.token.namespace{opacity:.7}.token.boolean,.token.constant,.token.number,.token.property,.token.symbol,.token.tag{color:#0cf}.token.attr-name,.token.builtin,.token.char,.token.selector,.token.string{color:#ff0}.language-css .token.string,.token.entity,.token.inserted,.token.operator,.token.url,.token.variable{color:#9acd32}.token.atrule,.token.attr-value,.token.keyword{color:#ff1493}.token.important,.token.regex{color:orange}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.deleted{color:red}pre.diff-highlight.diff-highlight>code .token.deleted:not(.prefix),pre>code.diff-highlight.diff-highlight .token.deleted:not(.prefix){background-color:rgba(255,0,0,.3);display:inline}pre.diff-highlight.diff-highlight>code .token.inserted:not(.prefix),pre>code.diff-highlight.diff-highlight .token.inserted:not(.prefix){background-color:rgba(0,255,128,.3);display:inline}
+--><link rel="icon" href="data:," /><title>Vier</title><link rel="stylesheet" href="xi.css" /><style>:root{--fg-accent:#4ea;}
+:root{--bg-accent:#275;}
+body{font-family:var(--sans-serif);}
+dt{font-weight:bold;
+font-size:1.0rem;}
+table{border-top:1px solid #fff;
+border-bottom:1px solid #fff;
+border-collapse:collapse;
+margin:.4rem 0;}
+th{border-bottom:1px solid #fff;}
+th,td{padding:.2rem;}code[class*=language-],pre[class*=language-]{font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:.4em .8em;margin:.5em 0;overflow:auto;background-color:#000}code[class*=language-]{background:#000;color:#fff;box-shadow:-.3em 0 0 .3em #000,.3em 0 0 .3em #000}:not(pre)>code[class*=language-]{padding:.2em;border-radius:.3em;box-shadow:none;white-space:normal}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#aaa}.token.punctuation{color:#999}.token.namespace{opacity:.7}.token.boolean,.token.constant,.token.number,.token.property,.token.symbol,.token.tag{color:#0cf}.token.attr-name,.token.builtin,.token.char,.token.selector,.token.string{color:#ff0}.language-css .token.string,.token.entity,.token.inserted,.token.operator,.token.url,.token.variable{color:#9acd32}.token.atrule,.token.attr-value,.token.keyword{color:#ff1493}.token.important,.token.regex{color:orange}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.deleted{color:red}pre.diff-highlight.diff-highlight>code .token.deleted:not(.prefix),pre>code.diff-highlight.diff-highlight .token.deleted:not(.prefix){background-color:rgba(255,0,0,.3);display:inline}pre.diff-highlight.diff-highlight>code .token.inserted:not(.prefix),pre>code.diff-highlight.diff-highlight .token.inserted:not(.prefix){background-color:rgba(0,255,128,.3);display:inline}
</style></head><body>
<h1>Vier</h1>
<p><dfn>Vier</dfn> is a keyboard-focused pixel art editor heavily inspired by Vim.</p>
@@ 27,11 36,11 @@ nimble <span class="token function">install</span>
</code></pre></section>
<section><h2 class="xd-section-heading">Modes and Tools</h2>In most graphics editing programs, there is the concept of a <dfn>tool</dfn>, a state of the editor which determines what action is performed when clicking on an image. This is also the case for Vier, but like in Vim, there is also the concept of <dfn>modes</dfn> – a state which affects more generally how keys are interpreted.
<p>Vier has these modes:</p>
-<dl><dt><img src="assets/icons/modes/inject.png" alt="Inject mode icon" /> Inject mode</dt><dd>In this mode, the user can move around the selected picture using <kbd>H</kbd><kbd>J</kbd><kbd>K</kbd><kbd>L</kbd> keys and draw with the currently selected tool. The color of the pixels being drawn is replaced by the selected color, so this can also work as an “eraser” if the selected color is transparent. If multiple pictures are opened, they can be switched between using <kbd>Ctrl</kbd>-<kbd>H</kbd> and <kbd>Ctrl</kbd>-<kbd>L</kbd>.</dd><dt><img src="assets/icons/modes/add.png" alt="Add mode icon" /> Add mode</dt><dd>In this mode, the user can move around the selected picture using <kbd>H</kbd><kbd>J</kbd><kbd>K</kbd><kbd>L</kbd> keys and draw with the currently selected tool. The selected color is added on the color of the pixels being drawn, which allows shading an area with a transparent color. If multiple pictures are opened, they can be switched between using <kbd>Ctrl</kbd>-<kbd>H</kbd> and <kbd>Ctrl</kbd>-<kbd>L</kbd>.</dd><dt><img src="assets/icons/modes/select.png" alt="Select mode icon" /> Select mode</dt><dd>In this mode, the user can move around the selected picture using <kbd>H</kbd><kbd>J</kbd><kbd>K</kbd><kbd>L</kbd> keys and select a part of the picture using the currently selected tool. The selection is currently useless; copy-paste functionality will be implemented later. If multiple pictures are opened, they can be switched between using <kbd>Ctrl</kbd>-<kbd>H</kbd> and <kbd>Ctrl</kbd>-<kbd>L</kbd>.</dd><dt><img src="assets/icons/modes/color.png" alt="Color mode icon" /> Color mode</dt><dd>In this mode, the user can move around a color palette (displayed at the top of the screen) to change the selected color (displayed in the upper left corner). If multiple palettes are available, they can be switched between using <kbd>Ctrl</kbd>-<kbd>H</kbd> and <kbd>Ctrl</kbd>-<kbd>L</kbd>.</dd><dt><img src="assets/icons/modes/command.png" alt="Command mode icon" /> Command mode</dt><dd>In this mode, the user can enter a command, displayed at the bottom of the screen, to perform complex actions such as opening a file. The commands are in the <a href="https://sprylang.se/">Spry</a> programming language, though this is not important for basic usage. The command is executed by pressing <kbd>⏎</kbd> or cancelled by pressing <kbd>Esc</kbd>.</dd></dl>
+<dl><dt><img src="assets/icons/modes/inject.png" alt="Inject mode icon" /> Inject mode <kbd>I</kbd></dt><dd>In this mode, the user can move around the selected picture using <kbd>H</kbd><kbd>J</kbd><kbd>K</kbd><kbd>L</kbd> keys and draw with the currently selected tool. The color of the pixels being drawn is replaced by the selected color, so this can also work as an “eraser” if the selected color is transparent. If multiple pictures are opened, they can be switched between using <kbd>Ctrl</kbd>-<kbd>H</kbd> and <kbd>Ctrl</kbd>-<kbd>L</kbd>.</dd><dt><img src="assets/icons/modes/add.png" alt="Add mode icon" /> Add mode <kbd>A</kbd></dt><dd>In this mode, the user can move around the selected picture using <kbd>H</kbd><kbd>J</kbd><kbd>K</kbd><kbd>L</kbd> keys and draw with the currently selected tool. The selected color is added on the color of the pixels being drawn, which allows shading an area with a transparent color. If multiple pictures are opened, they can be switched between using <kbd>Ctrl</kbd>-<kbd>H</kbd> and <kbd>Ctrl</kbd>-<kbd>L</kbd>.</dd><dt><img src="assets/icons/modes/select.png" alt="Select mode icon" /> Select mode <kbd>V</kbd></dt><dd>In this mode, the user can move around the selected picture using <kbd>H</kbd><kbd>J</kbd><kbd>K</kbd><kbd>L</kbd> keys and select a part of the picture using the currently selected tool. The selection is currently useless; copy-paste functionality will be implemented later. If multiple pictures are opened, they can be switched between using <kbd>Ctrl</kbd>-<kbd>H</kbd> and <kbd>Ctrl</kbd>-<kbd>L</kbd>.</dd><dt><img src="assets/icons/modes/color.png" alt="Color mode icon" /> Color mode <kbd>C</kbd></dt><dd>In this mode, the user can move around a color palette (displayed at the top of the screen) to change the selected color (displayed in the upper left corner). If multiple palettes are available, they can be switched between using <kbd>Ctrl</kbd>-<kbd>H</kbd> and <kbd>Ctrl</kbd>-<kbd>L</kbd>.</dd><dt><img src="assets/icons/modes/command.png" alt="Command mode icon" /> Command mode <kbd>;</kbd></dt><dd>In this mode, the user can enter a command, displayed at the bottom of the screen, to perform complex actions such as opening a file. The commands are in the <a href="https://sprylang.se/">Spry</a> programming language, though this is not important for basic usage. The command is executed by pressing <kbd>⏎</kbd> or cancelled by pressing <kbd>Esc</kbd>.</dd></dl>
<p>The following tools are available:</p>
-<dl><dt><img src="assets/icons/tools/brush.png" alt="Brush icon" /> Brush</dt><dd>The brush tool selects pixels that it moves over.</dd><dt><img src="assets/icons/tools/segment.png" alt="Segment icon" /> Segment</dt><dd>The segment tool selects a line segment.</dd><dt><img src="assets/icons/tools/rectangle-filled.png" alt="Rectangle icon" /> Rectangle</dt><dd>The rectangle tool selects an axis-aligned rectangle.</dd><dt><img src="assets/icons/tools/rectangle-outline.png" alt="Rectangle outline icon" /> Rectangle outline</dt><dd>The rectangle tool selects the outline of an axis-aligned rectangle.</dd><dt><img src="assets/icons/tools/ellipse-filled.png" alt="Ellipse icon" /> Ellipse</dt><dd>The ellipse tool selects an axis-aligned ellipse.</dd><dt><img src="assets/icons/tools/ellipse-outline.png" alt="Ellipse outline icon" /> Ellipse outline</dt><dd>The ellipse outline tool selects the outline of an axis-aligned ellipse.</dd><dt><img src="assets/icons/tools/flood.png" alt="Flood icon" /> Flood</dt><dd>The flood tool selects a contiguous area of pixels with the same color.</dd></dl></section>
+<dl><dt><img src="assets/icons/tools/brush.png" alt="Brush icon" /> Brush <kbd>B</kbd></dt><dd>The brush tool selects pixels that it moves over.</dd><dt><img src="assets/icons/tools/segment.png" alt="Segment icon" /> Segment <kbd>S</kbd></dt><dd>The segment tool selects a line segment.</dd><dt><img src="assets/icons/tools/rectangle-filled.png" alt="Rectangle icon" /> Rectangle <kbd>R</kbd></dt><dd>The rectangle tool selects an axis-aligned rectangle.</dd><dt><img src="assets/icons/tools/rectangle-outline.png" alt="Rectangle outline icon" /> Rectangle outline <kbd>Shift</kbd>-<kbd>R</kbd></dt><dd>The rectangle tool selects the outline of an axis-aligned rectangle.</dd><dt><img src="assets/icons/tools/ellipse-filled.png" alt="Ellipse icon" /> Ellipse <kbd>E</kbd></dt><dd>The ellipse tool selects an axis-aligned ellipse.</dd><dt><img src="assets/icons/tools/ellipse-outline.png" alt="Ellipse outline icon" /> Ellipse outline <kbd>Shift</kbd>-<kbd>E</kbd></dt><dd>The ellipse outline tool selects the outline of an axis-aligned ellipse.</dd><dt><img src="assets/icons/tools/flood.png" alt="Flood icon" /> Flood <kbd>F</kbd></dt><dd>The flood tool selects a contiguous area of pixels with the same color.</dd></dl></section>
<section><h2 class="xd-section-heading">Keyboard mappings</h2><p>The key mappings are inspired by Vim. They are currently not customizable.</p>
-<table><tr><th>Key</th><th>Alone</th><th>Shift</th><th>Control</th></tr>
+<table><tr><th>Key</th><th>Alone</th><th><kbd>Shift</kbd></th><th><kbd>Ctrl</kbd></th></tr>
<tr><td><kbd>⎵</kbd></td><td>hold to draw</td><td>hold to draw with secondary color</td></tr>
<tr><td><kbd>A</kbd></td><td>Mode ← Add</td></tr>
<tr><td><kbd>B</kbd></td><td>Tool ← Brush</td></tr>
@@ 58,7 67,7 @@ nimble <span class="token function">install</span>
<tr><td><kbd>;</kbd></td><td>Mode ← Command</td></tr></table>
Note that the mouse can also be used to draw and select colors. The right mouse button draws with the secondary color.
<section><h3 class="xd-section-heading">Selection keyboard mappings</h3><p>Some keys work differently when used with an active selection.</p>
-<table><tr><th>Key</th><th>Alone</th><th>Shift</th><th>Control</th></tr>
+<table><tr><th>Key</th><th>Alone</th><th><kbd>Shift</kbd></th><th><kbd>Ctrl</kbd></th></tr>
<tr><td><kbd>Esc</kbd></td><td>cancel selection</td></tr>
<tr><td><kbd>A</kbd></td><td>add selected color on selection</td></tr>
<tr><td><kbd>I</kbd></td><td>fill selection with selected color</td></tr>
@@ 66,6 75,6 @@ Note that the mouse can also be used to draw and select colors. The right mouse
<section><h2 class="xd-section-heading">Commands</h2><dl><dt><code>e image.png</code></dt><dd>open a file for editing (the filename is a symbol)</dd><dt><code>edit "image.png"</code></dt><dd>open a file for editing (the filename is a string)</dd><dt><code>flip-x</code></dt><dd>flip the current picture horizontally</dd><dt><code>flip-y</code></dt><dd>flip the current picture vertically</dd><dt><code>new</code></dt><dd>create a new picture with a transparent background and the default size</dd><dt><code>resize 16 8</code></dt><dd>resize the current picture, anchoring at the northwest corner</dd><dt><code>resize-nn 16 8</code></dt><dd>resize the current picture using the nearest-neighbor algorithm</dd><dt><code>w image.png</code></dt><dd>save the current picture under the specified filename (the filename is a symbol)</dd><dt><code>write "image.png"</code></dt><dd>save the current picture under the specified filename (the filename is a string)</dd></dl>
<p>Note that currently, edits done via commands are not added to undo history and break it.</p></section>
<section><h2 class="xd-section-heading">Planned features</h2><p>Roughly in order of priority.</p>
-<ul><li>upscaling (various algorithms)</li><li>variants of tools</li><li>better editing support and tab completion for the command line</li><li>mirrored drawing</li><li>color picker, palette editing</li><li>variations of tools (wide brush, fill with tolerance)</li><li>programmable configuration</li><li>gradients</li><li>animated sprite editing</li></ul></section>
+<ul><li>upscaling (various algorithms)</li><li>better editing support and tab completion for the command line</li><li>mirrored drawing</li><li>color picker, palette editing</li><li>variations of tools (wide brush, fill with tolerance)</li><li>programmable configuration</li><li>gradients</li><li>animated sprite editing</li></ul></section>
<section><h2 class="xd-section-heading">Name</h2><p>I partially created Vier as a semestral project for a Computer Graphics course at my university. The name of the lecturer can be loosely translated as “fear”, so I decided to name the project after a German word which is pronounced the same way. The word means “four”, which hints at the editor treating images as a square grid (with squares having four sides, obviously). I also came up with the backronym “Vim-Inspired Editor of Rasters”.</p></section>
</body></html>=
\ No newline at end of file
@@ 3,10 3,31 @@
SPDX-License-Identifier: GPL-3.0-or-later
-->]]
[set syntax-highlighting-theme; funky-x]
+[empty-favicon]
[style
[var fg-accent; #4ea]
[var bg-accent; #275]
+ [rule body;
+ [: font-family; [var sans-serif]]
+ ]
+ [rule dt;
+ [: font-weight; bold]
+ [: font-size; 1.0rem]
+ ]
+ [rule table;
+ [: border-top; 1px solid #fff]
+ [: border-bottom; 1px solid #fff]
+ [: border-collapse; collapse]
+ [: margin; .4rem 0]
+ ]
+ [rule th;
+ [: border-bottom; 1px solid #fff]
+ ]
+ [rule th,td;
+ [: padding; .2rem]
+ ]
]
+[def k; key; [<kbd> [arg key]]]
[title Vier]
[link-stylesheet xi.css]
[p [term Vier] is a keyboard-focused pixel art editor heavily inspired by Vim.]
@@ 52,64 73,64 @@
In most graphics editing programs, there is the concept of a [term tool], a state of the editor which determines what action is performed when clicking on an image. This is also the case for Vier, but like in Vim, there is also the concept of [term modes] [--] a state which affects more generally how keys are interpreted.
[p Vier has these modes:]
[description-list
- ; [link-image Inject mode icon; assets/icons/modes/inject.png] Inject mode; In this mode, the user can move around the selected picture using [<kbd> H][<kbd> J][<kbd> K][<kbd> L] keys and draw with the currently selected tool. The color of the pixels being drawn is replaced by the selected color, so this can also work as an [" eraser] if the selected color is transparent. If multiple pictures are opened, they can be switched between using [<kbd> Ctrl]-[<kbd> H] and [<kbd> Ctrl]-[<kbd> L].
- ; [link-image Add mode icon; assets/icons/modes/add.png] Add mode; In this mode, the user can move around the selected picture using [<kbd> H][<kbd> J][<kbd> K][<kbd> L] keys and draw with the currently selected tool. The selected color is added on the color of the pixels being drawn, which allows shading an area with a transparent color. If multiple pictures are opened, they can be switched between using [<kbd> Ctrl]-[<kbd> H] and [<kbd> Ctrl]-[<kbd> L].
- ; [link-image Select mode icon; assets/icons/modes/select.png] Select mode; In this mode, the user can move around the selected picture using [<kbd> H][<kbd> J][<kbd> K][<kbd> L] keys and select a part of the picture using the currently selected tool. The selection is currently useless[;] copy-paste functionality will be implemented later. If multiple pictures are opened, they can be switched between using [<kbd> Ctrl]-[<kbd> H] and [<kbd> Ctrl]-[<kbd> L].
- ; [link-image Color mode icon; assets/icons/modes/color.png] Color mode; In this mode, the user can move around a color palette (displayed at the top of the screen) to change the selected color (displayed in the upper left corner). If multiple palettes are available, they can be switched between using [<kbd> Ctrl]-[<kbd> H] and [<kbd> Ctrl]-[<kbd> L].
- ; [link-image Command mode icon; assets/icons/modes/command.png] Command mode; In this mode, the user can enter a command, displayed at the bottom of the screen, to perform complex actions such as opening a file. The commands are in the [link Spry; https://sprylang.se/] programming language, though this is not important for basic usage. The command is executed by pressing [<kbd> ⏎] or cancelled by pressing [<kbd> Esc].
+ ; [link-image Inject mode icon; assets/icons/modes/inject.png] Inject mode [k I]; In this mode, the user can move around the selected picture using [k H][k J][k K][k L] keys and draw with the currently selected tool. The color of the pixels being drawn is replaced by the selected color, so this can also work as an [" eraser] if the selected color is transparent. If multiple pictures are opened, they can be switched between using [k Ctrl]-[k H] and [k Ctrl]-[k L].
+ ; [link-image Add mode icon; assets/icons/modes/add.png] Add mode [k A]; In this mode, the user can move around the selected picture using [k H][k J][k K][k L] keys and draw with the currently selected tool. The selected color is added on the color of the pixels being drawn, which allows shading an area with a transparent color. If multiple pictures are opened, they can be switched between using [k Ctrl]-[k H] and [k Ctrl]-[k L].
+ ; [link-image Select mode icon; assets/icons/modes/select.png] Select mode [k V]; In this mode, the user can move around the selected picture using [k H][k J][k K][k L] keys and select a part of the picture using the currently selected tool. The selection is currently useless[;] copy-paste functionality will be implemented later. If multiple pictures are opened, they can be switched between using [k Ctrl]-[k H] and [k Ctrl]-[k L].
+ ; [link-image Color mode icon; assets/icons/modes/color.png] Color mode [k C]; In this mode, the user can move around a color palette (displayed at the top of the screen) to change the selected color (displayed in the upper left corner). If multiple palettes are available, they can be switched between using [k Ctrl]-[k H] and [k Ctrl]-[k L].
+ ; [link-image Command mode icon; assets/icons/modes/command.png] Command mode [k [;]]; In this mode, the user can enter a command, displayed at the bottom of the screen, to perform complex actions such as opening a file. The commands are in the [link Spry; https://sprylang.se/] programming language, though this is not important for basic usage. The command is executed by pressing [k ⏎] or cancelled by pressing [k Esc].
]
[p The following tools are available:]
[description-list
- ; [link-image Brush icon; assets/icons/tools/brush.png] Brush; The brush tool selects pixels that it moves over.
- ; [link-image Segment icon; assets/icons/tools/segment.png] Segment; The segment tool selects a line segment.
- ; [link-image Rectangle icon; assets/icons/tools/rectangle-filled.png] Rectangle; The rectangle tool selects an axis-aligned rectangle.
- ; [link-image Rectangle outline icon; assets/icons/tools/rectangle-outline.png] Rectangle outline; The rectangle tool selects the outline of an axis-aligned rectangle.
- ; [link-image Ellipse icon; assets/icons/tools/ellipse-filled.png] Ellipse; The ellipse tool selects an axis-aligned ellipse.
- ; [link-image Ellipse outline icon; assets/icons/tools/ellipse-outline.png] Ellipse outline; The ellipse outline tool selects the outline of an axis-aligned ellipse.
- ; [link-image Flood icon; assets/icons/tools/flood.png] Flood; The flood tool selects a contiguous area of pixels with the same color.
+ ; [link-image Brush icon; assets/icons/tools/brush.png] Brush [k B]; The brush tool selects pixels that it moves over.
+ ; [link-image Segment icon; assets/icons/tools/segment.png] Segment [k S]; The segment tool selects a line segment.
+ ; [link-image Rectangle icon; assets/icons/tools/rectangle-filled.png] Rectangle [k R]; The rectangle tool selects an axis-aligned rectangle.
+ ; [link-image Rectangle outline icon; assets/icons/tools/rectangle-outline.png] Rectangle outline [k Shift]-[k R]; The rectangle tool selects the outline of an axis-aligned rectangle.
+ ; [link-image Ellipse icon; assets/icons/tools/ellipse-filled.png] Ellipse [k E]; The ellipse tool selects an axis-aligned ellipse.
+ ; [link-image Ellipse outline icon; assets/icons/tools/ellipse-outline.png] Ellipse outline [k Shift]-[k E]; The ellipse outline tool selects the outline of an axis-aligned ellipse.
+ ; [link-image Flood icon; assets/icons/tools/flood.png] Flood [k F]; The flood tool selects a contiguous area of pixels with the same color.
]
]
[section Keyboard mappings;
[p The key mappings are inspired by Vim. They are currently not customizable.]
[table
- [header-row Key; Alone; Shift; Control]
- [row [<kbd> ⎵]; hold to draw; hold to draw with secondary color]
- [row [<kbd> A]; Mode ← Add]
- [row [<kbd> B]; Tool ← Brush]
- [row [<kbd> C]; Mode ← Color]
- [row [<kbd> D]; delete pixel]
- [row [<kbd> E]; Tool ← Ellipse; Tool ← Ellipse outline]
- [row [<kbd> F]; Tool ← Flood]
- [row [<kbd> H]; move left; [# move to left edge]; previous picture/palette]
- [row [<kbd> I]; Mode ← Inject]
- [row [<kbd> J]; move down; [# move to bottom edge]]
- [row [<kbd> K]; move up; [# move to top edge]]
- [row [<kbd> L]; move right; [# move to right edge]; next picture/palette]
- [# row [<kbd> M]; Tool ← Mirror]
- [row [<kbd> P]; paste]
- [row [<kbd> Q]; quit; force quit]
- [row [<kbd> R]; Tool ← Rectangle; Tool ← Rectangle outline; redo]
- [row [<kbd> S]; Tool ← Segment]
- [row [<kbd> U]; undo]
- [row [<kbd> V]; Mode ← Select]
- [row [<kbd> W]; write picture; write all pictures]
- [row [<kbd> X]; swap colors]
- [row [<kbd> Y]; pick color; pick secondary color]
- [row [<kbd> -]; zoom out; zoom out all pictures]
- [row [<kbd> =]; zoom in; zoom in all pictures]
- [row [<kbd> [;]]; Mode ← Command]
+ [header-row Key; Alone; [k Shift]; [k Ctrl]]
+ [row [k ⎵]; hold to draw; hold to draw with secondary color]
+ [row [k A]; Mode ← Add]
+ [row [k B]; Tool ← Brush]
+ [row [k C]; Mode ← Color]
+ [row [k D]; delete pixel]
+ [row [k E]; Tool ← Ellipse; Tool ← Ellipse outline]
+ [row [k F]; Tool ← Flood]
+ [row [k H]; move left; [# move to left edge]; previous picture/palette]
+ [row [k I]; Mode ← Inject]
+ [row [k J]; move down; [# move to bottom edge]]
+ [row [k K]; move up; [# move to top edge]]
+ [row [k L]; move right; [# move to right edge]; next picture/palette]
+ [# row [k M]; Tool ← Mirror]
+ [row [k P]; paste]
+ [row [k Q]; quit; force quit]
+ [row [k R]; Tool ← Rectangle; Tool ← Rectangle outline; redo]
+ [row [k S]; Tool ← Segment]
+ [row [k U]; undo]
+ [row [k V]; Mode ← Select]
+ [row [k W]; write picture; write all pictures]
+ [row [k X]; swap colors]
+ [row [k Y]; pick color; pick secondary color]
+ [row [k -]; zoom out; zoom out all pictures]
+ [row [k =]; zoom in; zoom in all pictures]
+ [row [k [;]]; Mode ← Command]
]
Note that the mouse can also be used to draw and select colors. The right mouse button draws with the secondary color.
[section Selection keyboard mappings;
[p Some keys work differently when used with an active selection.]
[table
- [header-row Key; Alone; Shift; Control]
- [row [<kbd> Esc]; cancel selection]
- [row [<kbd> A]; add selected color on selection]
- [# row [<kbd> D]; delete selection]
- [row [<kbd> I]; fill selection with selected color]
- [# row [<kbd> M]; cut selection]
- [row [<kbd> Y]; copy selection]
+ [header-row Key; Alone; [k Shift]; [k Ctrl]]
+ [row [k Esc]; cancel selection]
+ [row [k A]; add selected color on selection]
+ [# row [k D]; delete selection]
+ [row [k I]; fill selection with selected color]
+ [# row [k M]; cut selection]
+ [row [k Y]; copy selection]
]
]
]
@@ 131,7 152,6 @@
[p Roughly in order of priority.]
[list
; upscaling (various algorithms)
- ; variants of tools
; better editing support and tab completion for the command line
; mirrored drawing
; color picker, palette editing