Skip to main content

Create sophisticated liquid-glass SVG icon effects with theme-aware capabilities

Project description

Vexylicon

A Python package for creating sophisticated liquid-glass SVG icon effects with theme-aware capabilities.

Project Status

🚧 Alpha Release - Core functionality working, theme system and web interface in development.

Overview

Vexylicon transforms SVG icons into stunning glass-morphism designs with beveled edges. It takes a specially formatted base SVG with dual contours and generates smooth, progressive ring shapes that create a convincing 3D glass effect.

Current Features

Working

  • Glass effect generation with configurable bevel steps
  • Payload SVG injection with clipPath masking
  • CLI with create, batch, themes, and preview commands
  • Quality presets (low=8, medium=16, high=24, ultra=32 steps)
  • Multiple opacity progression modes
  • JSON-based theme system

⚠️ In Development

  • Theme-aware light/dark mode switching
  • Proper gradient duplication for themes
  • Gradio-lite web interface

Installation

From source (recommended during alpha):

git clone https://github.com/fontlaborg/vexylicon
cd vexylicon
python -m venv .venv
source .venv/bin/activate  # On Windows: .venv\Scripts\activate
pip install -e .

Quick Start

Basic Usage

Generate a glass effect icon:

vexylicon create --output my-icon.svg

With custom payload SVG:

vexylicon create --output my-icon.svg --payload logo.svg --quality high

Python API

from vexylicon import VexyliconGenerator, VexyliconParams

# Basic usage
generator = VexyliconGenerator()
svg_output = generator.generate()

# With payload
svg_output = generator.generate(payload_svg="logo.svg")

# Custom parameters
params = VexyliconParams(steps=16, quality="medium")
generator = VexyliconGenerator(params=params)

CLI Commands

create - Generate a single icon

vexylicon create [OPTIONS]

Options:
  --output TEXT              Output file path (default: output.svg)
  --payload TEXT             Path to payload SVG to inject
  --steps INTEGER            Number of bevel steps (default: 24)
  --quality TEXT             Preset: low/medium/high/ultra
  --opacity-progression INT  Opacity mode 1-4 (default: 4)
  --format TEXT              Output format: svg or png

batch - Process multiple SVGs

vexylicon batch INPUT_DIR OUTPUT_DIR [OPTIONS]

themes - List available themes

vexylicon themes

preview - Generate PNG preview (requires cairosvg)

vexylicon preview SVG_FILE [--output OUTPUT_PATH]

How It Works

  1. Base SVG: Uses best_base.svg as the template with dual contours
  2. Path Interpolation: Generates intermediate rings between inner and outer contours
  3. Opacity Progression: Applies mathematical opacity (linear to quartic)
  4. Glass Effect: Uses mix-blend-mode: screen for transparency
  5. Payload Injection: Optional SVG artwork clipped to inner shape

Opacity Progression Modes

  1. Linear: Even distribution
  2. Decreasing: Reverse exponential
  3. Exponential: Quadratic progression
  4. More Exponential: Quartic progression (default, best glass effect)

Architecture

vexylicon/
├── core.py              # VexyliconGenerator class
├── cli.py               # Fire-based CLI
├── utils/
│   ├── svg_processor.py # lxml-based SVG manipulation
│   ├── path_tools.py    # Path interpolation from icon_blender.py
│   └── theme_loader.py  # JSON theme validation
└── assets/
    ├── best_base.svg    # Base template
    └── themes/          # Theme definitions

Known Limitations

  • Theme switching CSS not fully implemented
  • Light/dark gradient variants need proper duplication
  • Complex SVG payloads may need manual adjustment
  • Web interface pending (Gradio-lite planned)

Development

Setup

# Install with dev dependencies
pip install -e ".[dev]"

# Run tests
pytest

# Code quality
black src tests
ruff check src tests
mypy src

Contributing

The project needs help with:

  1. Completing theme-aware gradient generation
  2. Building the Gradio-lite web interface
  3. Writing comprehensive tests
  4. Improving documentation

Technical Stack

  • Python 3.11+ (required)
  • lxml - Robust XML/SVG manipulation
  • svgpathtools - Path interpolation
  • pydantic - Theme validation
  • fire - CLI framework
  • rich - Terminal formatting

Roadmap

See TODO.md for detailed plans:

  1. Fix theme system (gradient duplication)
  2. Add CSS for light/dark switching
  3. Create Gradio-lite web interface
  4. Achieve >90% test coverage
  5. Publish to PyPI

License

MIT License - see LICENSE file

Author

Developed by Fontlab Ltd.

Acknowledgments

Based on the original icon_blender.py and icon_masker.py scripts, refactored into a modern Python package.

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

vexylicon-1.4.3.tar.gz (18.1 MB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

vexylicon-1.4.3-py3-none-any.whl (305.1 kB view details)

Uploaded Python 3

File details

Details for the file vexylicon-1.4.3.tar.gz.

File metadata

  • Download URL: vexylicon-1.4.3.tar.gz
  • Upload date:
  • Size: 18.1 MB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: python-httpx/0.28.1

File hashes

Hashes for vexylicon-1.4.3.tar.gz
Algorithm Hash digest
SHA256 6d9e88bef7e48b617318f55b57536c311d0648eb46c587b3da3fe88d33b78d59
MD5 9c67ae5eb79cf6d2bf713c56bb4f735a
BLAKE2b-256 63a5f03098158d66568d5a60355c950559827448034b05ee4ef72a5f204f07e6

See more details on using hashes here.

File details

Details for the file vexylicon-1.4.3-py3-none-any.whl.

File metadata

  • Download URL: vexylicon-1.4.3-py3-none-any.whl
  • Upload date:
  • Size: 305.1 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? No
  • Uploaded via: python-httpx/0.28.1

File hashes

Hashes for vexylicon-1.4.3-py3-none-any.whl
Algorithm Hash digest
SHA256 d898e63f25fae0e040da8853565b269156a264e77a8f76c61f388f698f1cb171
MD5 f2bf0a05d88fbbe97f5e3d8b5b2e142a
BLAKE2b-256 5f6b42cf3064f9533c4f8e4c92e1bad4501fe6ae472985c37d8f468e03335e97

See more details on using hashes here.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page