无需登录 数据私有 本地保存

标签云生成器 - 输入词语频率生成CSS

62
0
0
0
词语添加与管理

通过输入框添加自定义词汇及其权重值(1到10级)。词语列表显示所有已添加的词汇,支持随机排列打乱顺序、删除单个词语和清空全部功能。权重滑块操作直观,支持精确数值输入。每个词语独立管理,灵活增删。

外观参数调节

可自由调节最小/最大字体大小(px)、标签间距(px)和圆角大小(px)。字体大小范围决定了标签之间的视觉差异程度,间距和圆角控制整体美观度。所有参数调整即时反映在预览区域,支持滑块和数值输入两种方式。

配色方案选择

内置多套精心设计的配色方案,涵盖暖色、冷色、自然色和多彩风格。点击颜色块即可切换不同的配色方案。还支持自定义背景颜色,确保标签文字清晰可读。每套配色方案都经过精心调试,色彩搭配和谐美观,适合不同风格的网站。

实时预览

每次添加或修改词语、调整参数时,预览区域即时更新标签云效果。所见即所得,无需等待渲染即可看到最终效果。支持hover放大等交互效果预览,鼠标悬停可查看标签的交互状态和放大动画效果。预览区域可滚动浏览。

代码生成与复制

自动生成HTML结构代码、CSS样式代码或包含两者的完整代码。提供"HTML"、"仅CSS"和"全部"三种导出模式,满足不同使用场景。点击复制按钮一键复制到剪贴板,支持直接粘贴到项目中使用。代码格式清晰。

HTML文件导出

支持将完整的标签云导出为独立的HTML文件下载。文件包含内联样式和HTML结构,无需额外配置即可直接在浏览器中打开查看效果。方便在本地预览或分享给他人查看。文件自动以标签云主题命名。

示例数据加载

提供"加载示例数据"功能,一键填入预设的词语和权重数据。方便用户体验工具功能,也为需要快速生成标签云的用户提供参考模板。示例数据展示了最佳的权重分布和配色实践,帮助用户理解工具的使用方法。

随机排列功能

点击"随机排列"按钮可以打乱标签云中词语的显示顺序。避免按权重大小顺序排列导致的视觉单调感。每次点击都会生成不同的排列顺序,让标签云更加生动自然。配合不同的权重分布可获得丰富的视觉效果。