skills.rest
meytalp-dev
meytalp-devCOMMUNITY
Explore all skills by this author →
GitHub

add-lerani-logo

Insert the Lerani logo into HTML outputs with product-specific positioning.

Updated Mar 12, 2026
Search Tags:#automation#branding#html#consistency#web-design#logo#lerani
One-click install
npx skills add https://github.com/meytalp-dev/ort-training --skill add-lerani-logo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: add-lerani-logo
Source: https://github.com/meytalp-dev/ort-training/tree/main/.claude/skills/add-lerani-logo
Command: npx skills add https://github.com/meytalp-dev/ort-training --skill add-lerani-logo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automatically ensures every HTML output includes the Lerani branding logo, eliminating manual edits and branding inconsistencies.

Core Features & Use Cases

  • Automatic logo insertion on new HTML outputs across different formats (presentations, pages, infographics, quizzes).
  • Positioning guidelines per product type (top-right for pages, inside slides for presentations, etc.) to ensure consistent branding without user intervention.
  • Inline SVG logo that is decorative, accessible, and non-intrusive to user content.

Quick Start

Add the Lerani logo automatically to all HTML outputs by following the placement guidelines described in this skill.

Frequently Asked Questions about add-lerani-logo

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automatically add a logo to HTML outputs for consistent branding?▼

You can automatically add a logo to HTML outputs by using a skill that enforces consistent branding through frontmatter-driven configuration and inline SVG insertion across web pages, presentations, infographics, and quizzes.

What is the best way to ensure consistent logo positioning across different HTML presentation formats?▼

The best way to ensure consistent logo positioning is to apply automated guidelines per product type, such as placing the logo top-right for pages and inside slides for presentations, eliminating manual placement inconsistencies.

Do I need external dependencies or libraries to insert an inline SVG logo into my web design?▼

No, you do not need external dependencies to insert an inline SVG logo. The process uses frontmatter-driven configuration to apply accessible, decorative branding directly into your HTML outputs without requiring additional libraries.

Can I use automated branding rules for HTML quizzes and infographics without altering user content?▼

Yes, you can apply automated branding rules to HTML quizzes and infographics using a non-intrusive inline SVG logo that maintains accessibility while keeping your original user content completely unaltered.

How does frontmatter-driven configuration work for HTML logo automation?▼

Frontmatter-driven configuration works for HTML logo automation by reading metadata to determine the specific product type, automatically selecting the correct logo placement rules and applying the inline SVG without user intervention.

Related Skills

Explore More Design & Creative Skills→
meytalp-devmeytalp-dev

front-end-design

Apply the WOW front-end design system to HTML outputs with theming and typography.

Community
Advanced
JaykaijackJaykaijack

canvas-design

Generate design philosophy manifestos and export artwork as PDF or PNG.

Community
Intermediate
mostafa-K-raihanmostafa-K-raihan

diagram-design

Generate self-contained HTML diagrams with inline SVG and CSS.

Community
Advanced
TheArchitectitTheArchitectit
3

brand-guidelines

Apply Nord-inspired brand palettes and typography across PowerPoint, PDF, and HTML/CSS outputs.

Community
Intermediate