![](/gfx/play80.png)
![](/bbs/thumbs/pico64_okpal-6.png)
Okpal is a tool to create and edit color palettes. You can easily use those palettes in your programs, and even directly in Picotron's sprite and map editors.
Features
- Any change to the palette is propagated to Picotron's sprite and map editors.
- Use a perceptually uniform color space (oklab).
- Choose colors by hue, saturation and lightness.
- Reorder colors by drag-and-drop.
- Supports two file formats: ".hex" and ".pal"
- Multiple options for importing external palettes (keep default palette, overwrite it, or try to match it)
Usage
The tool shows you four different views of the 64 colors in the current palette:
- at the top-left of the screen, the colors are shown in palette order (same as in sprite editor first tab);
- below, on the left, the colors are shown inside a circle picker: the angle correspond to the hue, and the distance from the center correspond to the saturation;
- in the middle the colors are shown as inside a square picker: the X axis correspond to the saturation, and the Y axis correspond to the lightness;
- finally, on the right is a "test zone", where you can use 24 paintable cubes to test color combinations.
To modify a color, you must first select it. You can do that either by clicking in the palette overview at the top of the screen, or by clicking directly on one of the color dots in the circle picker or in the square picker.
Once selected, some information about the color are displayed on the right of the palette overview:
- the color number;
- the hex code corresponding to the RGB values of the color;
- a padlock icon: if the padlock is closed, the color is "locked" and cannot be edited; click on the icon to lock/unlock it;
- an eye icon: if the eye is closed, the color is only shown in the palette overview; it is hidden in the circle and square pickers.
- a paint bucket icon: you can click on it to change the color background to the current selected color; click again to go back to a black background.
You can copy the current color by using Ctrl-C, and paste a copied color onto the current one by using Ctrl-V. This also works outside OkPal: the color is stored in the clipboard as a hex code ("#ffacc5").
There is five different ways to adjust the selected color:
- a small colored circle outside the circle picker allows you to change the hue of the color;
- a small colored circle inside the circle picker allows you to change at the same time the hue and the saturation;
- a small colored triangle below the square picker allows you to change just the saturation;
- a small colored triangle at the right of the square picker allows you to change the lightness;
- finally, a small colored circle inside the square picker allows you to change at the same time the saturation and the lightness.
Any change you make can be reverted by hitting Ctrl-Z for undo. Use Ctrl-Y for redo.
Once you have several colors in you palettes, you can reorder them in the palette overview: just drag one color onto another, they will swap their positions. Note that both colors must be unlocked.
Using the palette in cartridges
By default, the palette you edit is saved in the cart you're working on, alongside your sprite sheets and maps.
The default path is "/ram/cart/pal/0.pal"
In order to use a palette in your programs, you just need to copy it in memory:
poke4(0x5000, get(fetch"/ram/cart/pal/0.pal")) |
Loading and saving
If you only need one palette for your cart, you don't need to do anything special to save it. It is saved alongside the rest of your assets each time you hit Ctrl-S.
In order to create a new palette, use the '+' button at the right of the tabs and choose the name of your new palette, for example "1.pal". If you need to start from scratch for this new palette, use "Empty Palette" or "Picotron Palette" from the menu.
You can load a previously created palette by using "Open File" in the menu.
Importing and exporting
You can import and export palettes for use with external tools. Currently the only supported format is ".hex" files, which are simple text files with one line per color, represented by their RGB code in hex format (without "#" or "0x", just the hexadecimal numbers).
To import a palette, choose "Open File" from the menu, and select the ".hex" file. If this is the first time you open this external palette in OkPal, a dialog will appear to let you choose how to arrange the colors in the palette. You can either:
- Keep default Picotron palette in the first 32 colors, and put the imported colors in the last 32 slots.
- Completely remove the Picotron palette and import the whole palette, but reorder the colors to try to match the default colors.
- Or simply import the palette as is. Note that this will affect the interface and probably make it difficult to use the menu, the sprite editor and the map editor.
Changelog
2024-08-23: version 1.0.3 (release #okpal-6)
- added: add file icon to saved palettes;
- changed: can load and import palettes by
double-clicking in the file dialog (no need
to drag-and-drop anymore); - fixed: bug in BBS;
2024-05-03: version 1.0.2 (release #okpal-5)
- fixed: bug while using "+" button in Picotron
0.1.0g; - changed: disabled tabs in BBS, as it prevents
the cart from running;
2024-04-27: version 1.0.1 (release #okpal-4)
- fixed: picotron's palette was not locked in the
default file on first opening; - fixed: saving a ".pal" file from an imported
".hex" file was not working; - explain how to export to .hex in the manual;
2024-04-06: version 1.0.0 (release #okpal-3)
- propagate palette to sprite and map editors;
- undo/redo;
- reorder colors by drag-and-drop;
- import dialog;
- reorder imported colors to match default colors;
- added a manual;
- menu entries to initialize the palette and open
the manual; - flash padlock icon when trying to edit a locked
color; - shift-click paint-bucket icon to change the "white"
color used in the interface, and ctrl-click the
icon to change the "black" (useful when importing
external palettes);
2024-04-02: version 0.0.3 (release #okpal-2)
- Added the ability to change the background color (by clicking on the small paint bucket icon), and switched the default background to black.
- Added the ability to import ".hex" files (using drag and drop from the "Open File" dialog); to actually create the ".pal" file, you need to save.
- Improved the color pickers.
- Added the ability to copy/paste colors (using a hex string starting with #).
- Added the ability to show/hide individual colors (right click on a color in the palette).
2024-04-01: v0.0.1 (release #okpal-1)
- Added the ability to lock colors, to avoid accidentally modifying them. By default the first 33 colors are locked (click on the padlock to unlock)
- Added the ability to hide specific rows of color from the two color pickers.
- Added sliders to change the individual components (hue, saturation and luminance).
- Added the ability to select a color by clicking on their dot in the color pickers.
- Added a test zone, with 24 paintable cubes (click on a cube face to change its color).
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/79935/ellapoly.png)
Very nice palette editor! and I think the userdata format you've chosen is probably ideal.
I added the ability to import and export your pal format to some of my apps to be compatible with this.
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/5951/20161009_512.png)
Thanks! I was just playing with your #paint cartridge! And by taking a look at your code, I figured how to add support for loading a palette by drag-and-drop (using the "drop_items" event).
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/41031/avapourwok.png)
would be lovely to offer the option to save as hex file
(text file, one colour per line, hexadecimal format without leading #)
example from lospec: https://lospec.com/palette-list/the-cosmos.hex
this is easy to convert with tonum in order to poke into picotron
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/5951/20161009_512.png)
Yes, it's planned! In the last version, you can already import hex files (by using the "Open File" dialog from the menu; note that you can't double click to open the files, you have to drag-and-drop them onto the application window).
I need to add an import dialog (to configure if you want to replace the default palette or just use the last 32 colors), and an export option in the menu.
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/58918/eyes-avatar-margins-right.png)
This is brilliant! I love how it adds an icon to the toolbar and integrates nicely with the desktop. And the editor itself is lovely. Great work!
Feature request: the ability to simply cut and paste the resulting hex code for the color shown ... sometimes I just want to get that single color into my code really quickly.
Thanks for your work drakmaniso!
edit: woops ... just noticed this feature has already been added! Excellent!
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/45923/akela_000.png)
love this, im currently workign on a 64 palette, would be interesting to see in this tool
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/5951/20161009_512.png)
I'm working on improving the import functionality. The problem with editing 64 colors palettes in OkPal is that it will overwrite the colors used by Picotron's GUI, which can make it difficult to find the "save" item in the menu...
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/5951/20161009_512.png)
I found how to propagate the palette to the sprite and map editors! This makes the tool much more immediately useful, as you can create your own colors and use them directly in Picotron's standard editors, and even go back and forth between OkPal and the editors to make some tweaks.
If other are writing color tools, here's how to do it:
send_message(gfx_pid, { event = "set_palette", palette = my_palette }) |
Where gfx_pid
is the pid of the sprite editor; you can find it by fetching /ram/system/processes.pod
, and searching for the entry with the correct name. And my_palette
is just the userdata corresponding to the palette in memory (so type i32, 64 entries).
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/5951/20161009_512.png)
I think picotron just ignores the alpha value, but I haven't tested it.
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/58918/eyes-avatar-margins-right.png)
This baby is in my startup.lua. That is all I have to say.
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/48557/dizzyMunchkinFloatingHead.png)
This is super useful! Its the kinda thing that works well built in with the other programs.
Do you think you could add exporting .hex? That'd be helpful because I'm trying to make an extended palette to use with https://www.lexaloffle.com/bbs/?pid=144322#p to make lighting work better. And I'm sure it would be useful for sharing to other platforms and such.
(oh just realized I can copy individual codes, but its still a bit of work to put those in a .hex file manually)
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/5951/20161009_512.png)
You can already export to .hex! Just use "Save File As" from the menu, and enter a name ending in .hex.
Maybe I should add an "Export" entry in the menu to make it more obvious? But that would still use the same file dialog, as this is not really customizable...
I also realized I forgot to explain the export feature in the manual...
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](https://www.lexaloffle.com/bbs/files/32135/ck.jpg)
Yeah it does ignore it, but if I make a text file for this, do I include it?
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/5951/20161009_512.png)
It's safer to not include any alpha channel. All the hex files I found online had only 6 digits, so this seem to be the standard.
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/92100/3_tic_computer_logo.png)
i've cant wait to make my own palette but its to hard to use the mouse
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/50324/Anakin_Pico_8_avatar_16x16_big.png)
I wonder if we will then use this system to create your own games, including those with a changed palette ?
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/41031/avapourwok.png)
this is a tool for editing! inside a game, we can always change the 64 colours of the palette, this program is not needed
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/media/90120/3_pfep 2.png)
when OkPal is open, if i load a new cart to ram it closes the current working palette. is there a way for it to then automatically open 0.pal for the new loaded cart?
also, it would be really neat if when saving a .pal, it would save this as metadata for the file icon!
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](https://www.lexaloffle.com/bbs/files/32759/comovic.gif)
Wow, it's definitely nice to be able to export as a .pal file!
If .pal files were included in the standard cart configuration, we'd be able to easily reuse, share, and manage palettes.
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/bimg/pi/pi4.png)
@Baulers
"How do you change the palette the normal way then?"
pal(color_num, 0xrrggbb, 2) --2 is rgb mode
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
![](/bimg/pi/pi26.png)
@drakmaniso, could you please give more details on how to get the colors into the tile and map editors?
I'm not entirely sure how to "fetch" the pid from /ram/system/processes.pod
. Also not sure what my_palette
should actually be.
![](/gfx/set_like0.png)
![](/gfx/top_drop.png)
I have been using this tool a lot and it is extremely helpful. For me, a couple of things would make it even better:
- provide a way to enter #rrggbb by hand as well as allowing pasting of the values
- Allow setting HSV and RGB values by typing them in individually
But really, thank you for creating this. even if you don't decide to take on my suggestions or they are unworkable.
[Please log in to post a comment]