https://github.com/devalade/penpot-color-name-ext
https://github.com/devalade/penpot-color-name-ext
Last synced: 8 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/devalade/penpot-color-name-ext
- Owner: devalade
- Created: 2025-01-12T11:19:36.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-20T18:02:03.000Z (about 1 year ago)
- Last Synced: 2025-01-20T18:35:35.252Z (about 1 year ago)
- Language: TypeScript
- Homepage: https://penpot-color-name-ext.vercel.app
- Size: 82 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Penpot Color Name Extension
A Penpot extension that helps designers instantly identify color names and suggests 4 similar color variants, making color selection effortless.
## Features
- 🎨 Instantly identify names for any selected color
- 🔍 Get 4 suggested color variants closest to your selection
- ⚡ Fast and lightweight implementation
- 🎯 Seamless Penpot integration
## Installation
1. Clone this repository:
```bash
git clone https://github.com/devalade/penpot-color-name-ext.git
```
2. Install dependencies:
```bash
pnpm install
```
3. Preview:
```bash
pnpm run dev
```
## Development
### Prerequisites
- Node.js 20.11.0+
- pnpm
- Penpot running locally or access to Penpot instance
### Project Structure
```
src/
├── assets/
│ ├── main.css
│ └── penpot.css
├── lib/
│ ├── color-utils.ts
│ ├── color-utils.test.ts
│ └── types.ts
├── App.svelte
├── plugin.svelte
├── types.svelte
└── main.ts
```
### Getting Started
1. Run development server:
```bash
pnpm run dev
```
2. Make changes in `src` directory
3. Test your changes in your web browser and Penpot
4. Build for production when ready
## Contributing
We welcome contributions! Please follow these steps:
1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Submit a pull request
You can use this function to simulate the color name generation - be sure to uncomment the function simulateColorChange in the onMount function in App.svelte
## License
MIT License
## Contact
- Create an issue for bug reports
- Submit PRs for contributions
- Shoot me a message on [@dev_alade](https://x.com/dev_alade)
## Acknowledgments
- Penpot team for the amazing platform
- Color naming libraries contributors
- Svelte team for v5 improvements
---
Built with ❤️ by devalade