Title: Vivido – Callout Boxes, Colored Notes & Dividers Author: infyon Published: September 30, 2026 Last modified: September 30, 2026 --- Search plugins ![](https://ps.w.org/vivido/assets/banner-772x250.png?rev=3721513) ![](https://ps.w.org/vivido/assets/icon-256x256.png?rev=3721513) # Vivido – Callout Boxes, Colored Notes & Dividers By [infyon](https://profiles.wordpress.org/infyon/) [Download](https://downloads.wordpress.org/plugin/vivido.1.4.1.zip) * [Details](https://sa.wordpress.org/plugins/vivido/#description) * [Reviews](https://sa.wordpress.org/plugins/vivido/#reviews) * [Installation](https://sa.wordpress.org/plugins/vivido/#installation) * [Development](https://sa.wordpress.org/plugins/vivido/#developers) [Support](https://wordpress.org/support/plugin/vivido/) ## Description **Vivido** is a lightweight, zero-dependency WordPress plugin that helps you design eye-catching content callouts, alert boxes, colorful dividers, syntax placers, and colored icon list markers without touching complex CSS. Whether you run a technical blog, documentation hub, tutorial site, or lifestyle blog, Vivido makes your key takeaways, warnings, quotes, and code snippets scannable and visually engaging. ### Why Use Vivido? * **Zero Bloat & Zero Dependencies:** Pure vanilla CSS and JavaScript. No bulky external frameworks or third-party fonts slowing down your page speed. * **Interactive Admin Builders:** Dedicated visual generators with live real-time previews for callouts, bullets, dividers, and code blocks. * **WYSIWYG & Block Ready:** Use interactive shortcodes anywhere—in Classic Editor, TinyMCE toolbars, Gutenberg Shortcode blocks, or page builders like Elementor. * **1-Click Code Copier:** Clean syntax blocks featuring automatic clipboard copying for commands, snippets, and scripts. ### Core Features * **Clean Alert & Notice Boxes (`[color_box]`):** - One-click presets: Tip (Green), Info (Blue), Warning (Amber), and Danger ( Red). - Deep customization: Solid, dashed, dotted, or double border strokes. - Border options: Full-frame box or minimalist left-accent quote bar. - Rounded corner radius controls and optional Call-To-Action (CTA) buttons. * **Minimalist Quote Notes (`[color_note]`):** - Sleek, distraction-free notice banners with a 4px left-hand border accent. * **Colored Horizontal Dividers (`[color_divider]`):** - Custom stroke thickness (1px–10px) and line styles (solid, dashed, dotted). - Width scaling (20% to 100%) and alignment controls (Left, Center, Right). * **Colored Icon List Bullets (`[vivido_list]` & `[vivido_item]`):** - Replace ordinary bullet dots with expressive status icons: Checkmarks, Stars, Warning Triangles, Crosses, Pointers, and Colored Dots. - 4 Badge Styles: Flat glyph, Solid filled circle, Soft pastel tint (duotone), and Outlined frame. * **Syntax Placer with Quick Copy (`[vivido_code]`):** - Formatted code blocks with clean language labels (BASH, PHP, JS, Python, SQL, etc.). - Native clipboard API copy button with instant “Copied!” visual feedback and fallback support. ## Screenshots [⌊Interactive Callout Box Generator with live preview.⌉⌊Interactive Callout Box Generator with live preview.⌉[ Interactive Callout Box Generator with live preview. [⌊Colored Bullet List & Badge Styler.⌉⌊Colored Bullet List & Badge Styler.⌉[ Colored Bullet List & Badge Styler. [⌊Horizontal Divider & Separator Designer.⌉⌊Horizontal Divider & Separator Designer .⌉[ Horizontal Divider & Separator Designer. [⌊Code Placer Builder with One-Click Copy functionality.⌉⌊Code Placer Builder with One-Click Copy functionality.⌉[ Code Placer Builder with One-Click Copy functionality. ## Installation 1. Upload the `vivido` folder to the `/wp-content/plugins/` directory, or install the `vivido.zip` package directly via **Plugins > Add New > Upload Plugin**. 2. Activate the plugin through the **Plugins** screen in WordPress. 3. Access the interactive shortcode generators under **Vivido** in your WordPress admin menu. ## FAQ ### Does Vivido slow down my website? No. Vivido does not load external web fonts or large script libraries. All styles and scripts are lightweight vanilla assets under 10KB total. ### Can I use Vivido with Gutenberg? Yes. You can paste generated shortcodes inside standard Gutenberg Shortcode or Paragraph blocks. A toolbar button is also provided for inline callout wrapping. ### Can I use custom hex colors? Yes. All shortcodes accept custom `#hex` color values for backgrounds, text, borders, dividers, and icon badges. ### Where can I get support or request features? Visit [Infyon.com/infyon](https://infyon.com/infyon) or post on the WordPress.org support forum for Vivido. ## Reviews There are no reviews for this plugin. ## Contributors & Developers “Vivido – Callout Boxes, Colored Notes & Dividers” is open source software. The following people have contributed to this plugin. Contributors * [ infyon ](https://profiles.wordpress.org/infyon/) [Translate “Vivido – Callout Boxes, Colored Notes & Dividers” into your language.](https://translate.wordpress.org/projects/wp-plugins/vivido) ### Interested in development? [Browse the code](https://plugins.trac.wordpress.org/browser/vivido/), check out the [SVN repository](https://plugins.svn.wordpress.org/vivido/), or subscribe to the [development log](https://plugins.trac.wordpress.org/log/vivido/) by [RSS](https://plugins.trac.wordpress.org/log/vivido/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 1.4.1 * Enqueued admin generator styles and scripts via `admin_enqueue_scripts` to meet WordPress.org directory standards. * Added `wp_kses_post` output sanitization across all shortcodes to prevent XSS vulnerabilities. * Fixed list layout container margins to maintain proper post alignment across block themes. * Enhanced clipboard copy engine with timer protection and textarea fallback for non-HTTPS contexts. * Confirmed compatibility with WordPress 7.1. #### 1.4.0 * Added dedicated visual builder for Horizontal Dividers (`vivido-dividers`). * Added dedicated visual builder for Code Placers with live copy testing (`vivido- code-blocks`). #### 1.3.0 * Added dedicated visual builder for Colored Bullet Lists (`vivido-bullets`). * Added 4 distinct badge styles: Flat, Solid, Soft Tint, and Outlined. * Improved hex-to-rgba converter for pastel list accents. #### 1.2.0 * Added dedicated top-level WordPress admin menu for Vivido. * Added interactive Callout Box Generator with live preview. * Added global settings for default border styles and corner radiuses. #### 1.0.0 * Initial release. ## Meta * Version **1.4.1** * Last updated **5 hours ago** * Active installations **Fewer than 10** * WordPress version ** 5.8 or higher ** * Tested up to **7.1.2** * PHP version ** 7.4 or higher ** * Language * [English (US)](https://wordpress.org/plugins/vivido/) * Tags * [callout box](https://sa.wordpress.org/plugins/tags/callout-box/)[code block](https://sa.wordpress.org/plugins/tags/code-block/) [icon list](https://sa.wordpress.org/plugins/tags/icon-list/)[info box](https://sa.wordpress.org/plugins/tags/info-box/) * [Advanced View](https://sa.wordpress.org/plugins/vivido/advanced/) ## Ratings No reviews have been submitted yet. [Your review](https://wordpress.org/support/plugin/vivido/reviews/#new-post) [See all reviews](https://wordpress.org/support/plugin/vivido/reviews/) ## Contributors * [ infyon ](https://profiles.wordpress.org/infyon/) ## Support Got something to say? Need help? [View support forum](https://wordpress.org/support/plugin/vivido/) ## Donate Would you like to support the advancement of this plugin? [ Donate to this plugin ](https://infyon.com/infyon)