Pixelgrafikverktyg
Starta ett projekt först
Det finns inget projekt att återställa i fliken för detta steg. Gå tillbaka till inställningen och skapa ett.
Tillbaka till inställningStäll in ett tomt pixelrutnät
Välj namn och logisk duk från 4×4 till 64×64. Ändrad storlek startar ett tomt projekt; pixlar samplas inte om.
Endast Hyperion pixelgrafik-JSON, högst 256 KiB. Ogiltiga filer ersätter aldrig ditt motiv.
Rita pixelgrafik för hand på ett tomt logiskt rutnät, utan prompt, bildkonvertering eller uppladdning. Välj en duk på upp till 64×64, skissa med penna, suddgummi och avgränsad fyllning, hämta färger, spegla penseldrag, ångra ändringar och exportera en transparent sprite. Redigeraren körs i webbläsaren och sparar projektet i den aktuella fliken.
Så ritar du pixelgrafik från grunden
-
1
Välj det logiska rutnätet
Namnge projektet och ställ in bredd och höjd från 4 till 64 pixlar. Förinställningar ger snabb åtkomst till kvadratiska dukar.
-
2
Rita och finslipa
Använd penna, suddgummi, fyllning eller pipett med din arbetspalett. Aktivera vågrät eller lodrät spegling och ångra hela penseldrag.
-
3
Granska din sprite
Kontrollera logiska mått, antal färglagda pixlar och antal färger före export.
-
4
Exportera en skarp fil
Hämta transparent PNG med heltalsskalning, kompakt SVG eller validerad projekt-JSON för fortsatt redigering.
Ett pixelgrafikverktyg för medvetet rutnätsritande
Pixelgrafik utformas ruta för ruta. Redigeraren börjar med ett tomt, transparent rutnät och lagrar en färg, eller transparens, för varje logisk pixel. Den omvandlar inte ett foto till block med medelfärger; använd Bildpixeleraren för det separata arbetsflödet. Den skapar inte heller grafik från en AI-prompt.
Ett mindre rutnät tvingar fram en tydligare silhuett, medan ett större ger plats för skuggning och detaljer. Detta är praktiska utgångspunkter, inte fasta regler:
| Logisk duk | Bra utgångspunkt |
|---|---|
| 8×8 | Mycket små symboler, glyfövningar och enkla tiles |
| 16×16 | Gränssnittsikoner, inventarieobjekt och kompakta sprites |
| 32×32 | Figurer, varelser och spelföremål |
| 64×64 | Detaljerade sprites, porträtt och större fristående motiv |
Behåll skarpa pixlar vid förstoring
PNG-exporten använder en heltalsskala och stänger av bildutjämning. En källpixel på en 16×16-duk blir därför en exakt kvadrat på 4×4, 8×8 eller större, inte en suddig kant. Schackmönstret och de valfria stödlinjerna är bara hjälpmedel i gränssnittet och följer aldrig med i filen. Transparenta rutor förblir transparenta.
SVG-exporten använder rektanglar med skarpa kanter och utelämnar transparenta rutor. Projekt-JSON bevarar det redigerbara logiska rutnätet och arbetspaletten. Det är Hyperions eget projektformat, inte en ersättning för lagerbaserade format i datorprogram för pixelgrafik.
Ritverktyg och spegling
- Penna färglägger rutor och förbinder snabba pekarpositioner så att linjen inte får glapp.
- Suddgummi gör rutorna transparenta igen.
- Fyllning ändrar ett område som sitter ihop i fyra riktningar; områden som bara nuddar varandra diagonalt förblir åtskilda.
- Pipett väljer färgen i en befintlig ruta. Om du hämtar transparens aktiveras suddgummit.
- Spegelritning speglar åtgärden från vänster till höger, uppifrån och ned eller åt båda hållen. Mittrader och mittkolumner tillämpas bara en gång.
Mus, penna, touch och tangentbord använder samma logiska rutnät. Fokusera duken, flytta den aktiva rutan med piltangenterna och tryck på Mellanslag eller Enter för att använda verktyget. P, E, F och I väljer verktyg; Delete suddar; Ctrl/Cmd+Z ångrar.
Webbläsarbeteende och tekniska källor
Redigeraren använder webbläsarens Canvas API, Pointer Events och styrning av bildutjämning. PNG skapas via Canvas API för blob-export. Tangentbords- och pekarinteraktionerna har utformats med riktlinjerna för hanterbarhet i WCAG 2.2 i åtanke.
Grafik, namn och paletter stannar i projektets lokala webbläsarstatus och läggs inte till i webbadresser eller våra servrar. Vanliga sidförfrågningar sker fortfarande när ett steg i tratten ändras. Om fliklagringen inte är tillgänglig kan den fullständiga ensidesredigeraren fortsätta fungera i minnet, men tratten går inte vidare eftersom projektet annars kan gå förlorat utan förvarning.
Vanliga frågor
Nej. Det är ett manuellt verktyg med ett tomt rutnät. Du väljer varje färg och ritar varje ruta med penna, suddgummi, fyllning, pipett och valfri spegling. Verktyget tar inte emot prompter och anropar ingen generativ tjänst.
Det här verktyget skapar ett nytt motiv från ett tomt rutnät. En bildpixelerare börjar med ett uppladdat foto eller en illustration och reducerar bilden till större block med medelfärger. Arbetsflödena har olika syften.
Prova 16×16 för en liten ikon eller 32×32 för en figur eller föremålssprite. Börja mindre när du tränar silhuetter och använd 64×64 först när motivet behöver fler detaljer. Bredd och höjd kan ställas in separat från 4 till 64 pixlar.
Ja. Tomma och raderade rutor har alfa noll i PNG-filen. Schackmönstret i redigeraren visar bara transparens och exporteras inte.
Exporten förstorar varje logisk pixel med en exakt heltalsskala och utan bildutjämning. Inga mellanfärger skapas mellan intilliggande rutor.
Nej. Version 1 redigerar en enda stillbild. Exportera enskilda bildrutor här och använd sedan det separata verktyget Sprite Sheet Generator för att packa dem i en atlas.
Duken stöder mus, penna och ett finger. Den kan också användas med tangentbord: pilarna flyttar den aktiva rutan, Mellanslag eller Enter använder verktyget och bokstavsgenvägar väljer verktyg.
Redigeraren laddar inte upp grafik, projektnamn, palett eller exportfil. Projektstatusen sparas i webbläsarfliken. Vanliga dokumentförfrågningar sker fortfarande när sidan öppnas eller du byter steg i tratten.
Relaterade verktyg
Material Design-färgväljare
Bläddra i Material Design-färgpaletten. Kopiera valfri nyans (50 till A700) som HEX, RGB eller HSL med en tryckning.
Skapa kontaktkarta
Ordna foton på utskrivbara kontaktkartor i A4 eller Letter med bildtexter och beskärning, förhandsgranska och hämta JPEG eller PDF.
Skapa korsstygnsmönster
Gör JPEG, PNG eller WebP till ett utskrivbart korsstygnsdiagram med 10–150 stygn, 2–40 egna färger, symboler, exakta antal och tygmått.
Flaggskapare
Formge en enkel egen 3:2-flagga i webbläsaren med sex layouter, färger, text och en symbol. Hämta SVG eller PNG, eller öppna webbläsarens utskriftsdialog.
Skapa visionboard
Förvandla dina mål till en visuell tavla: ladda upp bilder, lägg till en personlig rubrik och bildtexter, välj färger och layout och hämta en utskrivbar PNG. Allt stannar i din webbläsare.
Färgblindhetssimulator
Simulera hur en bild upplevs av personer med olika former av färgblindhet: protanopi, deuteranopi, tritanopi och achromatopsi.
Verktyget finns på andra språk
- Générateur de pixel art [FR]
- เครื่องมือสร้างพิกเซลอาร์ต [TH]
- مولّد فن البكسل [AR]
- Pembuat Pixel Art [ID]
- 픽셀 아트 생성기 [KO]
- Pixelartgenerator [NL]
- Trình tạo Pixel Art [VI]
- Pixel-Art-Generator [DE]
- Generator pixel artu [PL]
- Generador de pixel art [ES]
- ドット絵ジェネレーター [JA]
- Gerador de pixel art [PT]
- Pixel Art Generator [EN]
- Generatore di pixel art [IT]
- Редактор пиксельной графики [RU]
- Piksel Sanat Oluşturucu [TR]
- 像素画生成器 [ZH]