.saturation{cursor:pointer;position:relative}.saturation .slide{pointer-events:none;border:1px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;top:0;left:100px;box-shadow:0 0 1px 1px #0000004d}.hue{cursor:pointer;margin-left:8px;position:relative}.hue .slide{pointer-events:none;background:#fff;width:100%;height:4px;position:absolute;top:100px;left:0;box-shadow:0 0 1px #0000004d}.color-alpha{cursor:pointer;margin-left:8px;position:relative}.color-alpha .slide{pointer-events:none;background:#fff;width:100%;height:4px;position:absolute;top:100px;left:0;box-shadow:0 0 1px #0000004d}.sucker{fill:#9099a4;cursor:pointer;background:#2e333a;width:30px;transition:all .3s}.sucker:hover,.sucker.active{fill:#1593ff}.color-type{margin-top:8px;font-size:12px;display:flex}.color-type .name{float:left;color:#999;background:#252930;justify-content:center;align-items:center;width:60px;height:30px;display:flex}.color-type .value{color:#fff;box-sizing:border-box;background:#2e333a;border:0;flex:1;min-width:100px;height:30px;padding:0 12px}.colors{margin:0;padding:0}.colors.history{border-top:1px solid #2e333a;margin-top:10px}.colors .item{box-sizing:border-box;vertical-align:top;cursor:pointer;border-radius:3px;width:16px;height:16px;margin:10px 0 0 10px;transition:all .1s;display:inline-block;position:relative}.colors .item:nth-child(8n+1){margin-left:0}.colors .item:hover{transform:scale(1.4)}.colors .item .alpha{border-radius:4px;height:100%}.colors .item .color{border-radius:3px;width:100%;height:100%;position:absolute;top:0;left:0}.hu-color-picker{z-index:1;background:#1d2024;border-radius:4px;padding:10px;box-shadow:0 0 16px #00000029}.hu-color-picker.light .color-show .sucker{background:#eceef0}.hu-color-picker.light .color-type .name{background:#e7e8e9}.hu-color-picker.light .color-type .value{color:#666;background:#eceef0}.hu-color-picker.light .colors.history{border-top:1px solid #eee}.hu-color-picker canvas{vertical-align:top}.hu-color-picker .color-set{display:flex}.hu-color-picker .color-show{margin-top:8px;display:flex}.color-alpha{display:none}.color-show{overflow:hidden}.hu-color-picker{box-shadow:none;padding:0}.colors .item{width:24px;height:24px}.hu-color-picker.light{background:#fff}.hue{margin-left:30px}.hu-color-picker .color-type:nth-of-type(4){display:none!important}